Reputation: 5359
I'm working on an single page application that also needs offline access to Microsoft OneDrive. Accordingly I direct the user to authenticate with OneDrive using the code flow method.
The code is successfully retrieved by the application, but when a call is made to https://login.live.com/oauth20_token.srf the request fails with a CORS error.
See attached image for the HTTP headers from my javascript console on Chrome. The response from the server is missing the header
Access-Control-Allow-Origin:
which causes a CORS error
How do I enable CORS access for my app? I don't see any options in the developer console?
Thanks!
Upvotes: 4
Views: 1674
Reputation: 923
For the security issues, browsers will block requests from a different origin than sender except when API responsible enable allow origin requests in the returned back server answer. CORS configuration is, only, made by API's owner (Server part) in this case it is Microsoft; unfortunately you are not able to change this config except by blocking CORS sensing in browsers and this is not an ideal solution and may cause security risks and will be generalized to all apps accessed via that reconfigured browser.
You should perform the request via your server and wrap it in an accessed link from your API
Upvotes: 0
Reputation: 2035
Code flow is not supported for CORS. This is a pretty standard OAuth 2 implementation. Token flow is designed for use in single page applications / scenarios where CORS is necessary, and token flow does work with CORS.
If your app runs longer than the 1 hour validity of an access token, you can use a hidden IFRAME to silently reauthentication and get a new access token. More details are available on Authentication Scenarios for Azure AD
Upvotes: 0
Reputation: 11
Right now seems that there are no ways to fix this problem, but I found a work-around for developers.
If you are using Chrome as your browser, you can download this extension, and enable it when you are trying to authenticate. However, I don't think you want to ask the users to download this extension since this will sometimes cause security issue, and enabling it all the time will cause errors when you are using other sites (try Google or Facebook, Google will simply crash the website, and Facebook will prompts you something wrong).
As a result, you may want to try the other flow type. Code flow seems to be working on other platforms other than in the browser.
Upvotes: 1
Reputation: 321
You should be able to make authenticated requests with CORS to the OneDrive API's after you've received the access_token. From the HTTP headers provided, it looks like you'll need to perform one more call to redeem the code for an access token. You might want to see http://onedrive.github.io/auth/msa_oauth.htm (step 2). After you've received the access token, you will want to add the access token in the "Authorization" header of your request. Example of the HTTP request using CORS and response header below. I hope that helps.
var xhr = new XMLHttpRequest();
var oauthAccessToken = accessTokenStoredHere();
xhr.open('GET',
'https://api.onedrive.com/v1.0/drive/');
xhr.setRequestHeader('Authorization',
'Bearer ' + oauthAccessToken);
xhr.send();
GET /v1.0/drive/
HTTP/1.1
Authorization:Bearer YOUR_ACCESS_TOKEN
Host:api.onedrive.com
X-Target-URI:https://api.onedrive.com
Connection:Keep-Alive
Upvotes: 1