Ensure full OpenIDConnect authentication is completed when making requests through Ajax

Question

Ensure full OpenIDConnect authentication is completed when making requests through Ajax

Typically, the OpenIDConnect server functions as follows:

Visit a.com/secure-resource
Receive a 302 response from the server
Your browser redirects you to the identity server
Login on the identity server
Redirected back to a.com via a POST request
You are now logged in on a.com and receive access to a.com/secure-resource in your browser.

However, I have encountered a scenario that poses a challenge which requires assistance.

The user is already authenticated on idServer
User is logged in on a.com
User is NOT logged in on b.com
An ajax call needs to be sent to web server b.com (from a different domain a.com)
b.com uses OpenIDConnect for authentication
Due to the Ajax request to b.com, the standard redirection to idServer cannot occur. Instead, only a 302 is received in response.

We could potentially handle the 302 response via Ajax, however, there are security concerns regarding this approach.

Nevertheless

Are there any specific scenarios within IdentityServer/OpenIDConnect meant to address these types of situations?

javascript ajax openid openid-connect identityserver3

Answer 1

Answer №1

If you want to implement IdentityServer in this specific scenario, you will configure the server b.com to utilize Bearer Token Authentication. Afterwards, you must use the access token provided for a.com in the headers of your Ajax call.

$.ajax({
     url: 'http://b.com',
     headers: {
          Authorization: "Bearer " + Your Access Token
         }
     })

The IdentityServer Client samples written in JavaScript offer methods to retrieve the Token from the Identity Server, check them out here.

To obtain user information and the token in a controller, follow these steps:

// Get the claims values
var token= (User as ClaimsPrincipal).Claims
               .Where(c => c.Type == "access_token")
               .Select(c => c.Value).SingleOrDefault();

In different sections of your application, you can use the following code:

//Get the current claims principal
var identity = (ClaimsPrincipal)Thread.CurrentPrincipal;

// Get the claims values
var token = identity.Claims.Where(c => c.Type == "accept_token")
               .Select(c => c.Value).SingleOrDefault();

Answer 2

If you want to implement IdentityServer in this specific scenario, you will configure the server b.com to utilize Bearer Token Authentication. Afterwards, you must use the access token provided for a.com in the headers of your Ajax call.

$.ajax({
     url: 'http://b.com',
     headers: {
          Authorization: "Bearer " + Your Access Token
         }
     })

The IdentityServer Client samples written in JavaScript offer methods to retrieve the Token from the Identity Server, check them out here.

To obtain user information and the token in a controller, follow these steps:

// Get the claims values
var token= (User as ClaimsPrincipal).Claims
               .Where(c => c.Type == "access_token")
               .Select(c => c.Value).SingleOrDefault();

In different sections of your application, you can use the following code:

//Get the current claims principal
var identity = (ClaimsPrincipal)Thread.CurrentPrincipal;

// Get the claims values
var token = identity.Claims.Where(c => c.Type == "accept_token")
               .Select(c => c.Value).SingleOrDefault();

Ensure full OpenIDConnect authentication is completed when making requests through Ajax

Answer №1

Similar questions

What is the process for determining or managing the missing path attribute of a cookie in a Single Page Application?

The domain retrieval is contingent on the language preference of the user

Get the value of a JSON in template strings

Issue with Ajax call in WordPress not functioning via a plugin

Failed to transfer form data to server using ajax in Node.js

Reassigning a value in JavaScript can lead to unforeseen outcomes

In Javascript, the splice method removes all elements except the specified element

Is Redux really the new trend in the world of action creators?

Converting PHP Unicode character faces to hexadecimal for Arabic characters

Utilizing browser back functionality to dismiss a layer: A step-by-step guide

Update the specific component according to the identified modifications

Obtaining the Position of an Element Being Dragged in VueJS Drag and Drop Plugin

Tips for extracting the two characters following a space in a string with or without the use of regex

Retrieving every Cluster Object from Google Maps using Angular

Learn how to fetch data from PHP using XMLHttpRequest in ReactJS and then display that data within a sibling component

JavaScript does not support clicking on an iframe

What is the issue with this jQuery AJAX request?

Angular Resolve Upon Application Reloading

What is the best way to overlook content-encoding?

Unable to create a polygon on the Google Maps API using GPS coordinates inputted from a text field