Credentials stuck on pending state

[jimmyruann]

Your question
How can I solve /api/auth/callback/credentials on pending state?

What are you trying to do
I am trying to use NextAuth on a custom express server. I have setup everything according to the documentation and I ran into a small problem. /api/auth/callback/credentials is on pending state when I use signIn(). Other things like CSRF token work when I fetch from server.

Image: https://imgur.com/a/Mn0OiiF

I am using next-auth v3.1.0

pages/api/auth/[...nextauth].ts

const options = {
	providers: [
		Providers.Credentials({
			name: "Credentials",
			credentials: {
				email: { label: "Email", type: "text" },
				password: { label: "Password", type: "password" },
			},
			authorize: async (credentials) => {
				console.log("AHAHAH", credentials);
				// Add logic here to look up the user from the credentials supplied
				const user = { id: 1, name: "J Smith", email: "jsmith@example.com" };

				if (user) {
					return Promise.resolve(user);
				} else {
					// return Promise.resolve(null);
					// return Promise.reject(new Error('error message')) // Redirect to error page
					return Promise.reject("/auth/login?error=Bad"); // Redirect to a URL
				}
			},
		}),
	],
	database: process.env.DATABASE_URL,
	debug: true,
};

/pages/auth/login.tsx

signIn("credentials", { email: values.email, password: values.password })
	.then((response) => {
		console.log(response);
	})
	.catch((error) => {
		console.log(error.message);
	});

server/index.ts

app.prepare().then(() => {
    server.use(bodyParser.urlencoded({ extended: true }));
    server.use(bodyParser.json());
    server.use(cookieParser());
    server.use(cors({ credentials: true, origin: process.env.NEXTAUTH_URL }));

    server.all("/api/auth", (req, res) => {
        return app.render(req, res, "/api/auth", req.query as any);
    });
})

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

[guirip]

Hello

I struggled too when using Providers.Credentials, for me it turned out to be a simple string case issue in the file name for the api.

Is your file really name [...nextauth.ts] ? It should be [...nextauth].ts isn't it? 😉

[jimmyruann]

@guirip That was my bad, the file was [...nextauth].ts.