Shulou(Shulou.com)06/03 Report--

This article introduces the knowledge of "how to use OpenId Connect Implicit Flow in onelogin". In the operation of actual cases, many people will encounter such a dilemma, so let the editor lead you to learn how to deal with these situations. I hope you can read it carefully and be able to achieve something!

OpenId Implicit Flow

Implicit Flow is also called implicit authorization

The figure above is an example of implicit authorization. Unlike the Authorization Code model, the authentication server returns an access token fragment, only this fragment, we can not get access token.

Here we need to make an additional request to the client resource server, and the server will return a script script through which we parse the access token fragment to get the final access token.

In implicit authorization mode, it is generally used in situations where app or websites have no background logic. In other words, all authorizations are done at the front end.

The implicit authorization model is especially useful for single-page applications.

Let's take another look at the implicit authorization process in onelogin:

The user tries to establish a connection to your client app, and the request will be redirected to onelogin with a unique client_id configured.

Onelogin will authenticate and authorize user information.

The user information after authorization will be passed to the callback address configured in onelogin in the form of id_token (JWT).

Client app uses onelogin's public key to verify id_token, and if everything is ok, then a connection will be established.

Let's consider the security of the implicit authorization model.

In implicit authorization mode, client app needs to obtain the public key from onelogin and then use this public key to parse the id_token returned by onelogin.

Although a malicious user may get the public keys of client_id and onelogin, the returned id_token will only be sent to the configured callback address, so it is still secure.

Create a configuration for onelogin

Although we created an app in onelogin in the previous article, we created a new app here because of the difference in callback.

Fill in our callback address: http://localhost:3000

The others are consistent with the previous configuration.

Let's take a look at the latest SSO configuration:

Here we need to keep the latest client_ID, because it is not Authentication Flow mode, we do not need to use client_secret.

Notice the two Issuer URLs here, where the configuration information for onelogin is stored.

The running and request process of the page

We download implicitly licensed single-page applications from onelogin's official website example.

Https://github.com/onelogin/onelogin-oidc-node/tree/master/2.%20Implicit%20Flow

Modify the configuration of OIDC in javascript/main.js:

Const ONELOGIN_CLIENT_ID = '90a0e970-f2b6-0138-6171-0a5535c40b31178911 alternate Const ONELOGIN_SUBDOMAIN =' flydean-dev'

Then run npm install;npm start to start the single-page application.

Clicking the login button will take you to the login screen of onelogin:

Enter the username and password and we will jump back to the localhost page.

Here we will call https://flydean-dev.onelogin.com/oidc/2/certs to get the public key of onelogin.

Through the public key and the returned id_token, you can get the user's information.

Key code

Because it is a single-page application, all requests are actually executed through JS. Let's take a look at the key code of the system.

To use the openid protocol, the example here uses oidc-client.min.js, which is used to connect to the openid protocol through this client.

The following is the openid connect configuration information for the page:

Var settings = {authority: 'https://' + ONELOGIN_SUBDOMAIN +' .onelogin.com / oidc/2', client_id: ONELOGIN_CLIENT_ID, redirect_uri: _ window.location.origin, response_type: 'id_token token', scope:' openid profile', filterProtocolClaims: true, loadUserInfo: true}

With this configuration information, we can create a manager for oidc:

Var mgr = new Oidc.UserManager (settings)

The key code is very simple. When you click login, you need to jump to onelogin on the page to authorize login:

Function redirectToLogin (e) {e.preventDefault (); mgr.signinRedirect ({state:'some data'}). Then (function () {console.log ("signinRedirect done");}) .catch (function (err) {console.log (err);});}

After the authorization is completed, after jumping back to the local page, you need to verify the callback information, parse the user's information from this information, and display it on the page:

Function processLoginResponse () {mgr.signinRedirectCallback () .then (function (user) {console.log ("signed in", user); document.getElementById ("loginResult") [xss_clean] = 'Success' + JSON.stringify (user, null, 2) +'}) .catch (function (err) {console.log (err);});}

All the logic is encapsulated in oidc-client.min.js and is very friendly to programmers.

This is the end of "how to use OpenId Connect Implicit Flow in onelogin". Thank you for reading. If you want to know more about the industry, you can follow the website, the editor will output more high-quality practical articles for you!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.