I've encountered an issue where the Google provider works perfectly on Chrome and other browsers, but fails to work on Safari. Despite going through the documentation thoroughly, I couldn't find any relevant information to resolve this.
This is how I have declared my provider in [...nextauth].js
import NextAuth from "next-auth";
import CredentialsProvider from "next-auth/providers/credentials";
import GoogleProvider from "next-auth/providers/google";
import FacebookProvider from "next-auth/providers/facebook";
export default NextAuth({
debug: true,
providers: [
GoogleProvider({
clientId: process.env.GOOGLE_CLIENT_ID,
clientSecret: process.env.GOOGLE_CLIENT_SECRET,
state: false,
authorizationUrl:
'https://accounts.google.com/o/oauth2/v2/auth?prompt=consent&access_type=offline&response_type=code',
}), ...
The problem arises when trying to sign in with Google:
async function signInWithGoogle() {
const res: any = await signIn("google");
if (res && res.error) {
setErrorMsg(res.error);
setShowError(true);
} else if(!res) {
router.push("/account-error")
}
else {
router.push("/somepage");
}
}
In Safari, the 'res' object always remains undefined. While checking the console logs, I noticed that NextAuth successfully generates a valid authorization URL under [next-auth][debug][GET_AUTHORIZATION_URL], yet the redirection doesn't occur on Safari specifically.