CODEWITHSUNDEEP
next.jsauth0
mxcdh
mxcdh

Reputation: 1161

nextjs + auth / this site can’t provide a secure connection

I have problem with secure connection in my project. Bellow my setup and code: enter image description here enter image description here

What is wrong?

p.s My code base on this tutorial: https://thetechhulk.com/auth0-and-next-js-authentication-complete-guide

Upvotes: 4

Views: 5594

Answers (4)

Maziar Rumiani
Maziar Rumiani

Reputation: 764

As can be seen in your browser, I guess you are not using SSL,so please make sure you are using http in your .env.local file for NEXTAUTH_URL's key:

NEXTAUTH_URL = http://localhost:3000

Upvotes: 1

Piran
Piran

Reputation: 7328

Even if you define envvar NEXTAUTH_URL="http://localhost:3000" it can still redirect to https (the secure rather than the insecure version).

It may be that the envvar VERCEL="1"; this happens by default if you run vercel env pull .env to keep your envvars uptodate.

To solve this, in Vercel set the VERCEL environment variable just for Development to be blank. Then the next time you pull into .env you should see:

VERCEL=""

The code for next-auth that triggers this can be seen here: https://github.com/nextauthjs/next-auth/blob/main/packages/next-auth/src/utils/detect-origin.ts:

  if (process.env.VERCEL ?? process.env.AUTH_TRUST_HOST)
    return `${protocol === "http" ? "http" : "https"}://${forwardedHost}`

Upvotes: 19

Vinícius Rodrigues
Vinícius Rodrigues

Reputation: 1

error image - chrome

url error: "localhost:3000/api/auth/callbackerror=MUST+match+the+registered+callback+URL+for+this+application"

Check your Github OAuth Authorization Callback URL

Github Authorization Callback URL

Check Your ".env.local" NEXTAUTH_URL

this solved the problem for me.

Upvotes: 0

AndreVitorio
AndreVitorio

Reputation: 980

I had a similar issue and the problem was my NEXTAUTH_URL was pointing to https://localhost:3000 instead of http://localhost:3000

Upvotes: 12

Related Questions