Angular应用程序中的Azure AD OpenID Connect注销的CORS问题

Question

I have a tenant in Azure which hosts a number of apps. I'm using OpenID Connect for authorization. In the login.microsoft.com openid-configuration, an end_session_endpoint URL is supplied. This article explains how to send a sign-out request. This will end the session in Azure, but not on my client (an Angular2 SPA). To do this, I'm using angular-oauth2-oidc and the following code:

this.http.get('https://login.microsoftonline.com/TENANT_ID/oauth2/logout",')
    .toPromise()
    .then(function () { 
        this.oauthService.logOut();
    }
);

The GET to login.microsoftonline.com will end the session on the server and the logOut() call will end the session locally. When I run this, I get the following error:

XMLHttpRequest cannot load https://login.microsoftonline.com/TENANT_ID/oauth2/logout . No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin ' http://localhost:51518 ' is therefore not allowed access.

When I check the response from the login.microsoftonline.com GET, Access-Control-Allow-Origin is not one of the response headers. I'm very surprised it wouldn't have that header with * as the value. In any event, how can I address this? I see there is a CORS setting in App Services and I added my localhost (testing locally currently) to CORS for one of the apps in the tenant, but it's still not working.

Temporarily, I've added an API endpoint on my apps API that makes a call in C# to the login.microsoftonline.com URL, but it's annoying to have to do that. I'd like to do it all through javascript.

Answer 1

You need to redirect the browser to the URL. You can't call it over AJAX.

You must also redirect the user to the end_session_endpoint for sign-out.

Azure AD does not allow cross-domain calls on the login endpoints, and you can't change that.

You can redirect the user to:

https://login.microsoftonline.com/ccb87602-82bf-4f35-b7d2-aa‌​aaaaaaaaaa/oauth2/lo‌​gout?post_logout_red‌​irect_uri=https%3a%2‌​f%2fsitename.azurewe‌​bsites.net%2fHome%2f‌​SignedOut

The post_logout_redirect_uri parameter allows you to specify where the user's browser should be redirected after log out. This way the user won't lose context. Do make sure to save up the user's work on your app's side before redirecting so you don't get angry users.