CODEWITHSUNDEEP
angularjssingle-page-applicationaureliakeycloak
wpenn
wpenn

Reputation: 11

Aurelia.js Single Page Application Keycloak Authentication Example

I need an example or pointers for using Keycloak.js authentication in an Aurelia.js-based single page web application. In my use case, a user should be able to access my web SPA before login. However, to gain access to additional resources, user will need to log in. No problem with with the backend apps. 'Just need web-client help.

I have basic HTML5 and Angular.js examples. It seems the example provided by bandrzejczak comes the closest.

'Have already searched throughout the web, read the Keycloak, Aurelia, Aurelia-Auth, Aurelia-Authorization docs. I have spent way too much time on this and am hoping someone has already solved this problem. -- Thanks

Upvotes: 0

Views: 956

Answers (1)

wpenn
wpenn

Reputation: 11

See Aurelia-Keycloak.

Aurelia-Keycloak

Alpha version. An authentication plugin based on KeyCloak for Aurelia applications.

Get Started

  • Install Aurelia-Keycloak:

    jspm install aurelia-keycloak

  • Add keycloak configuration and initialization settings:

Follow Keycloak directions for creating a keycloak.json configuration file. Put this file in the same directory as your application's index.html file. Refer to the keycloak javascript adapter documentation for its initialization options and API.

  • Add plugin to your app's main.js. This example assumes your keycloak.json is in your root directory. This code will immediately cause the login screen to appear.
    .plugin('aurelia-keycloak', {initOptions:{ onLoad: 'login-required' }})
  • To defer login, use the following: .plugin('aurelia-keycloak') Then, construct a login button within your code to call the keycloak login function.
  • Rather than use a keycloak.json file, you can insert the installation config with the plugin declaration

`.plugin('aurelia-keycloak',{install:{PASTE GENERATED KEYCLOAK.JSON HERE}},initOptions:{ onLoad: 'login-required' }}

See the GITHUB for details.

Upvotes: 1

Related Questions