We Want to Hear From You! What Do You Want to See on the Community? Tell us here!
Forum Discussion
fa11
9 years agoExplorer | Level 3
Dropbox API: No CORS header present
Hi,
I am using the dropbox core API v2 with angularJs web client using $resource and Express REST server to access dropbox. After i moved to $resource from my client instead of $http, I am getting the following CORS error when redirecting to dropbox for OAuth2 authentication as mentioned in the Dropbox OAuth2 guide.
If i enable a CORS extension for chrome, i don't get this error but the redirect does not happen.
XMLHttpRequest cannot load https://www.dropbox.com/oauth2/authorize?client_id=...&response…...&redirect_uri=https%3A%2F%2Flocalhost%3A3443%2Fcallback. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://localhost:3443' is therefore not allowed access.
(the redirect URI is valid as it works in the browser, i've modified the url pasted here to change client id and response for security reasons)
Any insight will be greatly apprecited. Here are snippets of related code:
app.use(function(req, res, next) { res.header("Access-Control-Allow-Origin", req.headers.origin); res.header("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE, OPTIONS"); res.header("Access-Control-Allow-Credentials", "true"); res.header("Access-Control-Allow-Headers","Origin, x-access-token, X-Requested-With, Content-Type, Accept, Authorization, X-CSRF-Token, Accept-Version, Content-MD5, Date, X-Api-Version, X-File-Name"); // //res.header("Access-Control-Allow-Headers",(req.headers['access-control-request-headers']) ? req.headers['access-control-request-headers'] : "x-requested-with"); //intercepts OPTIONS method if ('OPTIONS' === req.method) { //respond with 200 res.sendStatus(200); } else { //move on next(); } });
and
var csrfToken = generateCSRFToken(); req.session.csrf = csrfToken; console.log("redirecting to dropbox uri"); var redirectURl = url.format({ protocol: 'https', hostname: 'www.dropbox.com', pathname: 'oauth2/authorize', query: { client_id: APP_KEY, response_type: 'code', state: csrfToken, redirect_uri: generateRedirectURI(req) } }); console.log("rediect uri is "+redirectURl); res.redirect(redirectURl);
Thanks!
4 Replies
- Greg-DB9 years ago
Dropbox Community Moderator
I can't offer any insight on using Angular or Express, but based on the error output, which cites XMLHttpRequest, it seems like your setup is trying to make an ajax call to /authorize, instead of sending the user there directly in their browser. The /authorize page is a web page the user needs to interact with directly, not indirectly from another page via JavaScript, so CORS shouldn't come in to play. You'll need to look in to how to configure your web framework to redirect the user normally, as opposed to making a XMLHttpRequest. Apologies I don't have any Angular or Express insight to share for that, but perhaps someone else on the forum does.
- fa119 years agoExplorer | Level 3
Hi Greg,
Thanks a lot for your response! Since it seemed to work before (I made some changes to my server), I retracted my changes to my code and now am getting a slightly different version of this error which is as follows. It happens when dropbox tries to redirect to my callback function. It seems like my server refuses to accept the redirect back from dropbox:
XMLHttpRequest cannot load https://www.dropbox.com/oauth2/authorize?client_id=...&response…..&redirect_uri=https%3A%2F%2Flocalhost%3A3443%2Fcallback. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://localhost:3443' is therefore not allowed access.
Any ideas? Does your response from before still apply to this case?
Many thanks for your time. - Greg-DB9 years ago
Dropbox Community Moderator
As far as I can tell, the only difference between the two errors is the redaction, so I don't have any new insight to offer here. - fa119 years agoExplorer | Level 3
Right. Thanks a lot!
About Dropbox API Support & Feedback
Find help with the Dropbox API from other developers.6,034 PostsLatest Activity: 34 minutes ago
The Dropbox Community team is active from Monday to Friday. We try to respond to you as soon as we can, usually within 2 hours.
If you need more help you can view your support options (expected response time for an email or ticket is 24 hours), or contact us on X or Facebook.
For more info on available support options for your Dropbox plan, see this article.
If you found the answer to your question in this Community thread, please 'like' the post to say thanks and to let us know it was useful!