Not able to authenticate via NextAuth's Twitter provider using OAuth2.0

[ronykris]

Environment

System: OS: Linux 5.4 Ubuntu 20.04.2 LTS (Focal Fossa) CPU: (8) x64 Intel(R) Core(TM) i7-10610U CPU @ 1.80GHz Memory: 17.85 GB / 24.75 GB Container: Yes Shell: 5.0.17 - /bin/bash Binaries: Node: 16.0.0 - ~/.nvm/versions/node/v16.0.0/bin/node Yarn: 1.22.10 - ~/.nvm/versions/node/v16.0.0/bin/yarn npm: 7.10.0 - ~/.nvm/versions/node/v16.0.0/bin/npm Browsers: Chrome: 100.0.4896.127 npmPackages: next: 12.2.5 => 12.2.5 next-auth: ^4.10.3 => 4.10.3 react: 18.2.0 => 18.2.0

Reproduction URL

it's a localhost url

Describe the issue

Hi there,

I am having a hard time getting nextauth to authenticate via OAUth2 using the twitter provider. Upon clicking on "sign in with twitter" I am presented with an error saying "something is wrong". Screenshot attached:

Also, the below gets reported in console logs: ondemand.BranchSdk.62484ce8.js:1 GET https://app.link/_r?sdk=web2.56.2&branch_key=key_live_knJAF6W45vSHVJiP0wn8figpqFePX59K&callback=branch_callback__2 net::ERR_BLOCKED_BY_CLIENT

I have ensured the redirect uri in twitter's developer profile is not the localhost url but something like https://127.0.0.1:3000/api/auth......

Below is how I have the provider defined in next

import NextAuth from "next-auth/next";
 import TwitterProvider from "next-auth/providers/twitter";

 export default NextAuth({
    // Configure one or more authentication providers
    providers: [
        TwitterProvider({
            clientId: process.env.TWITTER_ID,
            clientSecret: process.env.TWITTER_SECRET,
            version: "2.0",
      }),
      // ...add more providers here
    ],
  })

I am not sure what I am doing wrong. Is it the redirect uri? Any pointers would be of immense help,

Thank you!

How to reproduce

It's a std next project with nextauth configured to authenticate via oauth2. Click on sign in via twitter and most likely you'd see this error.

Expected behavior

First it would request my permission to allow access to the app and eventually it should have authenticated me and signed me up.

[Sagargajare]

@balazsorban44 I would like to work on this issue.

Can you guide and assign it to me?

[jellohouse]

I'm getting the same issue... It gets to the twitter page and says "Something went wrong"

[codewithbernard]

Same issue happening to me.

[DZuz14]

If you care about getting the users email address, the 2.0 version of the api doesn't give you it btw. My app currently works with 2.0, but then gives me this error when i take out the version: "2.0" property.

[balazsorban44]

We will need a minimal reproduction repo for this, likely with a description of the config in https://developer.twitter.com/en/portal/projects-and-apps

I cannot reproduce this issue.

[balazsorban44]

Make sure that you can see this in the Twitter developer dashboard:

[richcahill]

I've just run into the same issue. Word by word via the tutorials and my Twitter Developer dashboard config matches that outlined by @balazsorban44

[CRSylar]

same issue for me, i'm using NextAuth in several other projects ( not with Twitter), but here just don't work..

It seems like the call URL isn't fired, in fact if click the "back" button ( same screenshot as above) it brings me to the Twitter homepage, not my localhost

[sherwinwater]

I had the same issue and finally I find the Oauth2 client ID and Secret in the Keys and tokens should be used, instead of consumer keys.

[mikhail-karan]

I'm having this issue right now. I am using the 2.0 client ID and Client Secret but get the something went wrong screen.

I'm using http://127.0.0.1:5173/ as the callback url

[enzoferey]

For people coming to this issue, the callbackUrl parameter and the redirect_uri query parameter are two different things. In order to have a redirect_uri value that uses http://127.0.0.1 as Twitter OAuth2.0 flow requires, you need to set your NEXTAUTH_URL environment variable to http://127.0.0.1 as well (docs on the next-auth website generally point to use http://localhost, which won't work in this case).

[AmdjedBelgacem]

For anyone with the same issue for X platform, under the callback URI add (path)/api/auth/callback/twitter, if you are on localhost:3000 then http://localhost:3000/api/auth/callback/twitter or on your production link (production-link)/api/auth/callback/twitter