Question

64

No 'Access-Control-Allow-Origin' header with Microsoft Online Auth

rated 0 times [ 70] [ 6] / answers: 1 / hits: 18468 / 8 Years ago, mon, july 11, 2016, 12:00:00

I am trying to make a simple request to get an access token using the Microsoft graph OAuth endpoint. When I send the simple request below I get

No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'localhost:8080/myapprunninglocally' is therefore not allowed access.**

var xhttp = new XMLHttpRequest();

xhttp.open(GET, https://login.microsoftonline.com/common/oauth2/authorize?client_id=<client_id>&scope=wl.signin%20wl.calendars_update&response_type=token&redirect_uri=localhost:8080/myapprunninglocally, true);

xhttp.send();

I have also registered this app using Microsoft Azure Directory, requested ALL permissions, and used the delegated client_id.

I have read up on CORS and I am aware Cross-Origin Policies however, I'm aware there are APIs which expose endpoints that include the 'Access-Control-Allow-Origin' in their response headers. Is anyone able to help?

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

mariamiyanab

Add To Favorites

Follow

Total Points: 75

Total Questions: 102

Total Answers: 92

Location: British Indian Ocean Territory

Member since Tue, Feb 22, 2022

2 Years ago

answered 8 Years ago rocioblancac · Accepted Answer

To integrate AAD in javascript, we suggest you to use azure-activedirectory-library-for-js which is a library in javascript for frontend to integrate AAD with a ease.

There are 2 options we need to pay attention on before we use ADAL for JS:

According the node at https://github.com/OfficeDev/O365-jQuery-CORS#step-6--run-the-sample:

Note This sample will not work in Internet Explorer. Please use a different browser, such as Google Chrome. ADAL.js uses an iframe to get CORS API tokens for resources other than the SPA's own backend. These iframe requests require access to the browser's cookies to authenticate with Azure Active Directory. Unfortunately, cookies are not accessible to Internet Explorer when the app is running in localhost.

Enable the oauth2AllowImplicitFlow of your Azure AD application. Refer to https://crmdynamicsblog.wordpress.com/2016/03/17/response-type-token-is-not-enabled-for-the-application-2/ for the detailed steps.

Here is the code sample to acquire access token from Microsoft Graph:

<script src=https://secure.aadcdn.microsoftonline-p.com/lib/1.0.14/js/adal.min.js></script>



<body>

<a href=# onclick=login();>login</a>

<a href=# onclick=getToken()>access token</a>

</body>

<script type=text/javascript>

    var configOptions = {

        tenant: <tenant_id>, // Optional by default, it sends common

        clientId: <client_id>,

        postLogoutRedirectUri: window.location.origin,

    }

    window.authContext = new AuthenticationContext(configOptions);



    var isCallback = authContext.isCallback(window.location.hash);

    authContext.handleWindowCallback();



    function getToken(){

        authContext.acquireToken(https://graph.microsoft.com,function(error, token){

            console.log(error);

            console.log(token);

        })

    }

    function login(){

        authContext.login();

    }

</script>