Getting 502: BAD_GATEWAY when hosting on Vercel

[ecuber]

Your question
Does anyone have any ideas as to why deploying to Vercel would break my code?

What are you trying to do
I'm using NextAuth for logging in and some Google Classroom API stuff and it works great in development. When I deployed to Vercel, however, I get this 502 error every time I try to log in, saying 'NO_RESPONSE_FROM_FUNCTION'. The error comes up after logging in and authorizing Google and everything, then at gets hung up on the /api/auth/callback/google callback for about 10 seconds then Vercel times out.

I looked at #279 and I definitely have all the appropriate URI's specified in the Google dev console. Any ideas as to what can be done to identify the problem would be super appreciated!

Feedback

• Found the documentation helpful
• Found documentation but was incomplete
• Could not find relevant documentation
• Found the example project helpful
• Did not find the example project helpful

[iaincollins]

Hmm it's probably poor error handling from a provider in NextAuth.js resulting in this error.

If the callback URLs are wrong then I would guess it's a problem with configuration options (e.g. Client ID, Client Secret). It's tricky to handle errors well as providers throw them at all sorts of different points in the flow and in different ways. I would double check for whitespace, missing characters, etc in the relevant environment variables / secrets (maybe just remove them and re-add them).

Adding GitHub or Twitter as a provider is super easy (they are very simple and low-friction) if you just want to sanity check that something works and that the issue is just with the provider and not with the app in some other way.

[ecuber]

Thanks for your quick reply.

I have double checked all my environment variables and I'm sure that they are all correct. I also added a GitHub provider and it worked fine in testing but the same timeout issue occurred after deploying (env variables were set correctly then as well).

Only other thing I changed was before I was using a "custom" Google provider (just the example one from the docs) because I didn't realize you could add scopes using the built-in provider which I'm doing now.

[iaincollins]

Huh that's interesting that GitHub is having a problem too, as it's a much simpler service to setup and less error prone (as less to go wrong) so handy for debugging.

I wonder if it's an issue talking to the database in prod, if you are using one? You could try enabling the debug: true NextAuth.js option in production and then looking in the logs to see if there are any database errors.

[ecuber]

Aha, you nailed it! My MongoDB wasn't accepting the connection because I had it set up whitelisting only my home IP addresses. Works like a charm now!

Thanks so much for your help and for all your work on this awesome project :)