CODEWITHSUNDEEP
node.jsoauth-2.0
Sean D
Sean D

Reputation: 4292

OAuth2: `redirect_uri` provided did not match what is authorized by the code

I am new to OAuth2 and would like guidance on why I see this in my browser main window and debugger console:

TokenError: The `redirect_uri` provided did not match what is authorized by the code.

Steps

  1. My frontend react.js app has a link to: https://app.asana.com/-/oauth_authorize?response_type=code&client_id=1188550654936298&redirect_uri=https%3A%2F%2Fasanarepeater.ngrok.io%2Foauth%2Fcallback&state=160063113436700

  2. I setup a reverse proxy on localhost:6500 to https://asanarepeater.ngrok.io

  3. I give the above url plus /oauth, concatenated, to the oauth service (Asana) through the dev console, and receive back this url:

https://app.asana.com/-/oauth_authorize?response_type=code&client_id=1188550654936298&redirect_uri=https%3A%2F%2Fasanarepeater.ngrok.io%2Foauth%2F

I add a state query parameter and try using it in a front end app via button click.

  1. I am asked to log in by the OAuth service

  2. After logging in, I see the following in the browser window and my express api's debug console:

TokenError: The `redirect_uri` provided did not match what is authorized by the code.
    at Strategy.OAuth2Strategy.parseErrorResponse (/home/owner/cp/project/node_modules/passport-oauth2/lib/strategy.js:358:12)
    at Strategy.OAuth2Strategy._createOAuthError (/home/owner/cp/project/node_modules/passport-oauth2/lib/strategy.js:405:16)
    at /home/owner/cp/project/node_modules/passport-oauth2/lib/strategy.js:175:45
    at /home/owner/cp/project/node_modules/oauth/lib/oauth2.js:191:18
    at passBackControl (/home/owner/cp/project/node_modules/oauth/lib/oauth2.js:132:9)
    at IncomingMessage.<anonymous> (/home/owner/cp/project/node_modules/oauth/lib/oauth2.js:157:7)
    at IncomingMessage.emit (events.js:327:22)
    at endReadableNT (_stream_readable.js:1220:12)
    at processTicksAndRejections (internal/process/task_queues.js:84:21)

The reverse HTTPS proxy also shows:

GET /oauth/                    500 Internal Server Error

What mistake is being made above?

I should note I see the auth code being returned in the url of the error page:

https://asanarepeater.ngrok.io/oauth/?code=1%2F11192028978382%3Af818bceafeef50d7fREMOVED

In case the Express.js endpoints are relevent I have included them below. Both routes are prefixed with /oauth

router.get(
  '/callback',
  passportWithAsanaStrategy.authenticate('Asana'),
  (req: Request, res: Response) => {
    const jwt = jsonwebtoken.sign((req.user as { asana_id: string }).asana_id, JWT_SECRET!);

    res
      .cookie('asanaIdJwt', jwt)
      .status(200)
      .redirect(FRONTEND_URL!);
  },
);

/*
  passport middleware redirects to the scope grant page

  thus no route handler callback
*/
router.get('/', passportWithAsanaStrategy.authenticate('Asana'));

Upvotes: 0

Views: 2653

Answers (2)

rob_st
rob_st

Reputation: 414

I had a similar issue and solved it by URL encoding the redirect URL.

Upvotes: 1

Evert
Evert

Reputation: 99816

Usually with OAuth2 you select 1 specific redirect uri when setting up your OAuth2 credentials. If the url during setup does not match what you send in the redirect_uri query parameter, OAuth2 servers are supposed to reject the request for security reasons.

So, I think that you will probably need to go into your asana OAuth2 settings and see what was set for the redirect_uri.

Upvotes: 1

Related Questions