Problem with javascript and oauth

I’m having problems with the OAuth method in the API with javascript. It seems that this specific method has no support for CORS and the browser ignores me the answer.
I’m using Chrome and the Asana library for Browser.

Is there a way to solve my problem, besides the reverse proxy solution?

I am doing the very same, using NodeAPI inside an Angular app. Works fine. Did you put your localhost callback url in the app configuration, both in code and Asana configuration?

Yes, everything it’s configured. It just work when i disable the CORS from the chrome.

I am not sure I understand what the problem is and how you solved it. Can you elaborate please?

Sure, i’m using the javascript library to access to the Asana API, but when i try to use it i’m getting this error:


I try with localhost but it didn’t work, later i try with a subdomain of my app with SSL but it didn’t work either.
The only way that cold work if i disable the CORS from my browser.

What browser are you using? :thinking:
So you found a way to make it work, right?

I’m using Google chrome.
Not quite, i’m just disable the CORS for develop purpose but i can’t expect that every user will do that in their computer.

I am very surprised because I never had this issue before. How do you disable CORS in Chrome?

Hi @Andre_Peregrina,

Could you show the HTTP request that Chrome is making to Asana’s API? Notably it should be sending a valid Origin header - if we don’t receive an Origin header, we won’t send back the Access-Control-Allow-Origin header in response.

My best guess as to what is happening is that your parameters are slightly off, e.g. the app hasn’t been granted permission yet. The server is responding with an error page, but that error page doesn’t have the CORS headers. I’ve seen this before in a few other places where the server responds with generic error pages that don’t have CORS headers though successful requests will.

However, this may be intentional in this case.

You should not be doing code-based OAuth token-exchange from the browser. The browser isn’t a secure environment in general because it’s running on an untrusted machine in most cases. You should only use implicit grant so that the browser doesn’t store the long-lived refresh token. It’s not surprising that those pages were never designed to be called asynchronously from the browser.

When calling oauth_authorize you should be request response_type=token instead of using response_type=code. You then won’t have to go through the extra step of exchanging the code for a token. The client library should handle this with an option somewhere.

2 Likes

Sure, this is the request:

I running the localhost environment, but i already try in production, and i have the same result.