denoland / deno

A modern runtime for JavaScript and TypeScript.
https://deno.com
MIT License
97.38k stars 5.36k forks source link

Strange behaviour with next-auth with sign in redirects #26538

Open littledivy opened 1 week ago

littledivy commented 1 week ago

I have a mid-sized Next.js 15.0.1 which uses next-auth with Github provider. When calling signIn, the server returns HTML (the default login page) instead of a JSON response which causes a SyntaxError.

"use client";

import { signIn } from "next-auth/react";

const SignInButton = () => {
  return (
    <button
      className="px-6 py-3 bg-primary text-white rounded-full shadow-md hover:bg-primary"
      onClick={() => signIn("github", { callbackUrl: "/dash" })}
      type="button"
    >
      Get Started
    </button>
  );
};

export default SignInButton;
SyntaxError: Unexpected token '<', "<!DOCTYPE "... is not valid JSON

This only happens when running the server with Deno (deno task dev). npm run dev works fine.

HerrTuring commented 1 day ago

I am also having the same problem while using the CredentialsProvider. The same code that runs perfectly in Node.js gives the exact same error while running inside Deno.

Already checked for the route, I can make the route do a console.log if I remove the next-auth handler from it and create my own route. If I use the handler and add a console.log inside of it, it clearly doesn't even reach the authorize method.

HerrTuring commented 1 day ago

My simplified example:

/app/api/auth/[...nextauth]/route.ts

import NextAuth from "next-auth";
import CredentialsProvider from "next-auth/providers/credentials";

const handler = NextAuth({
    providers: [
        CredentialsProvider({
            credentials: {
                email: { label: "Email", type: "email" },
                password: { label: "Password", type: "password" },
            },
            async authorize(credentials) {
                console.log(credentials);

                return {};
            },
        }),
    ],
    pages: {
        signIn: "/signin",
        error: "/signin",
    },
});

export { handler as GET, handler as POST };

Copied from the example of OP:

"use client";

import { signIn } from "next-auth/react";

const SignInButton = () => {
  return (
    <button
      onClick={() => signIn("credentials", {
                email: "test@test.com",
                password: "password",
            })}
      type="button"
    >
      Get Started
    </button>
  );
};

export default SignInButton;

When running inside npm this will result in a console.log of the given credentials (inside the signIn function) in the server's console. In Deno this will result in this error in the browser instead:

SyntaxError: Unexpected token '<', "<!DOCTYPE "... is not valid JSON
littledivy commented 1 day ago

I think this might be related to https://github.com/denoland/deno/issues/26667