/
Setting up client application

Setting up client application

Introduction

There are various ways of working with authentication server.

This chapter briefly describes web app cooperation with Keycloak.

Authentication scripts

Authentication config

Most important bits are located in:

WebApp/apps/HyperDoc/resources/scripts/index-auth.js



Auth helper will fecvth current server config by using this URL

../config/keycloak/browser-client

with the sample result:

{ realm: "tessel-demo4", auth-server-url: "https://keycloak-maz.test.bim.cloud/auth/", ssl-required: "external", resource: "HDC FM browser client", public-client: true, confidential-port: 0 }

Based on this parameters we can init KC adapter in JavaScript and execute functions like login / logout.

Review remaining source of index-auth.js for more details. 

Authentication of web services

This part is handled centrally by this override:

WebApp/apps/HyperDoc/overrides/data/Connection.js



Universal bit for checking token validity, refreshing and processing the request is this:

hdcAuth.adapter.updateToken(15) .then(function (refreshed) { if (hdcAuth.adapter.authenticated) { options.headers = options.headers || {}; options.headers['X-Authorization'] = 'Bearer ' + hdcAuth.getToken(); this.setVersionHeader(options); this.request(_options, true); } else { HD.TslSecurity.login(); } }.bind(this)) .catch(function () { HD.TslSecurity.login(); });

Using file download with "Pre auth"

Check out this file for sample on how file download with pore auth token works. 

WebApp/packages/local/tsl-utils/src/TslDownload.js

These two functions are used universally to sent POST request to file download URL. 

preAuthDownload: function(url, params){ Ext.Ajax.request({ url: url, method: 'POST', callback: this.preAuthComplete, urlParams: params, scope: this }); }, preAuthComplete: function(opts, success, response){ var data = HD.TslResponse.getResponseData(response); var params = opts.urlParams; var securedUrl = data.url; if(typeof params === 'string'){ securedUrl += params; } window.open(securedUrl, 'systemDownloadHelper'); },

A response contains a temporary short token that can be used to send a GET request.

 NOTE: this method is not needed if we download a file using XHR request. In such case we can provide standard Bearer token in request headers. 

Useful docs

https://github.com/keycloak/keycloak-documentation/blob/master/securing_apps/topics/oidc/javascript-adapter.adoc

https://www.keycloak.org/docs/latest/securing_apps/index.html#_javascript_adapter

Related content

(sv) Setting up client application
(sv) Setting up client application
More like this
(sv) Implementing Basic login
(sv) Implementing Basic login
More like this
(no) Implementing Basic login
(no) Implementing Basic login
More like this
Implementing Basic login
Implementing Basic login
More like this
Using Default Login Provider
Using Default Login Provider
More like this