JWT Token-Based Auth with AngularJs

published:
Recently I developed a large customer portal where users should be able to login via different authentication providers. The backend is purely written in C# where as the frontent is basically a AngularJS Application.
Authentication Flow

As our entry point is an AngularJS application, we decided to use the Hybrid-Authentication Flow as defined in this RFC and explained in this article (http://www.heise.de/developer/artikel/Flexible-und-sichere-Internetdienste-mit-OAuth-2-0-2068404.html?artikelseite=2)

Backend-Implementation

From the backend perspective, the whole authentication process is delegated to the Identity Server from ThinkTecture, a C# Component which provides an OpenId-Connect (also known as OIDC) compilant authentication-server.


Check it out at https://identityserver.github.io/Documentation/docsv2/, the version 2.0 was just released a few days ago.

As per this delegation, a trusted relationship needs to be established between the backend-system (a .NET Application in our case) an the Identity Server. Mostly this is done with PKI and a signature to check the validity of the token when the client (the browser in our case) sends the token back to the server as Http-Header like Authentication: Bearer id....


Existing Libraries

The following libraries are more or less compatible with AngularJS and the given approach

Anvil Connect

Page: http://anvil.io/

Notes:
  • Works with OpenId and some small adjustments
  • Has no refresh functionality

heise.de Sample

Page: https://github.com/manfredsteyer/angular-with-openid-connect
Blog: http://www.heise.de/developer/artikel/Tipps-und-Tricks-fuer-AngularJS-Teil-3-OAuth-2-0-2620374.html?artikel

Notes:
  • Validates Issuer, Audience, Nonce
  • Refresh included
  • Claims Parsing included
  • Does not not Logout at IdServer (destroy session on idServ)
  • Nonce must be generated @ Server (stateful somehow)

Satellize

Page: https://github.com/sahat/satellizer

Notes:
  • Does not handle token response in client
  • Needs server component who exchanges accesstoken to a idtoken

oauth-ng

Page: http://andreareginato.github.io/oauth-ng/
Code: https://github.com/andreareginato/oauth-ng

Notes:
  • Not OIDC-Compatible
  • Does not directly handle callbacks

AngularJs-Oauth2

Page: https://github.com/JamesRandall/AngularJS-OAuth2
Blog: http://www.azurefromthetrenches.com/?p=2241

Notes:
  • Wrapped in a directive
  • Not OIDC Compatible
  • No Refresh Handling

Active Directory Authentication Library m(ADAL) for Javascript

Page: https://github.com/AzureAD/azure-activedirectory-library-for-js

Notes:
  • Conceptual fine
  • Tightly coupled to Azure AD

Decision

All of the mentioned libraries have different benefits (i.e. well styled, nice community or support for various external Identity Providers). All I wanted was a AngularJS-Compatible module to integrate with a OpenId-Connect capable Identity Server. I didn't expect that there will be no library which addresses this requirements. So I ended up at this point thinking of writing such a library itself.

Tada!



OIDC-Angular


The Angular-JS Module has the following capabilities:
  • Login / Logout from an Idp
  • Stores token in Browser-Storage and reaccess it later
  • Configurable API-Urls to intercept with Authentication-Header
  • Hightly Configurable
  • Several Events (i.E. TokenExpiration, MissingToken, Login, Logout, etc.)
  • Fully integrated into client-Code (no server component needed)

Check out the sources on: https://github.com/michaelschnyder/oidc-angular or, as common in the Javascript-World

bower install michaelschnyder/oidc-angular

Comments

Post a Comment

Popular posts from this blog

Home Assistant in Docker with Nginx and Let's Encrypt on Raspberry Pi

published:
Image
This guide will help to you to setup home assistant as a docker container and make it publicly available behind a ngix proxy, all running in containers. Additionally, we'll use certbot to keep your ssl certificates in sync and Duck DNS so that you access it even with a dynamic ip address. There we go... Dockerized Home Assistant behind Nginx with Let's Encrypt and DuckDNS :) This guide is partially based on the generic guide on how to install Ngix and Let's Encrypt by Philipp ( Nginx and Let’s Encrypt with Docker in Less Than 5 Minutes | by Philipp | Medium ) In order to start, please make sure you have the following setups done already Home Assistant installed as docker container and available under port 8123 Create a DuckDNS account and register your subdomain You know how to redirect a port from your router to the computer running docker We'll be using docker-compose, which is much simpler to use than the plain docker cli. If you are not familiar with docker-compose,
Read more

Use Bodmer TFT_eSPI Library with PlatformIO

published:
Image
If you start playing around with TFT on your ESP8266 or ESP32, you will arrive at the excellent TFT_eSPI Library by Bodmer . It's not only magnitudes faster than the Adafruit driver , it's also comes with support for a wide range of display drivers. Test results of the TFT_eSPI library Unfortunately it has one catch: The library is not really ready to be included as a library in your projects as it requires adjustments in the library itself. While it's not uncommon to define your settings with #define directives, this library expects you to patch files to configure it . The official way goes like this Locate the library folder (Windows would be Documents\Arduino\libraries\TFT_eSPI ) and create your own setup in the library sub folder User_Setups To use your configuration, patch the file User_Setup_Select.h  to include your configuration This has obviously some disadvantages. At latest when you wan't to update the library or work with different screens at the same tim
Read more

Migrating from Arduino IDE to Visual Studio Code to PlatformIO

published:
Image
Like every other beginner on ESP8266 I started with my first steps in the official Arduino IDE. I was impressed by the simplicity and easy to use examples that were build-in to the UI. Also the simple UI made it easy to start in uncharted land, especially for someone that did never develop embedded firmware. The library manager let me install additional libraries to play around with, and it also mostly worked. Standard Arduino Editor (IDE) Needless to say, I missed a lot of the features that I was used to from more powerful IDE's like IntelliJ or Visual Studio. I think even Visual Basic 6 had a better IntelliSense support than the Arduino IDE. In fact, Arduino IDE has none. Also, the lack of a dependency management (for libraries) makes it really hard to share code between multiple peers, as you have to manually install the correct version of a library in the global libraries folder. Guess what happens if you use different versions? But overall the Arduino IDE is a g
Read more