The below code is what i am using to authorize a user based on a return from an API call. the response should be { email: "email@email.com", password: "password123"}. But the code does not work and I get the error:
Unexpected token '<', "<!DOCTYPE "... is not valid JSON

export const authOptions = {
  providers: [
    CredentialsProvider({
      name: "Credentials",
      credentials: {
        email: { label: "Email", type: "text" },
        password: { label: "Password", type: "password" },
      },
      async authorize(credentials, req) {
        const res = await fetch("http://localhost:3000/pages/api/user/signin", {
          method: "POST",
          headers: {
            "Content-Type": "application/json",
          },
          body: JSON.stringify({
            email: credentials?.email,
            password: credentials?.password,
          }),
        });

        const user = await res.json();

        if (user) {
          return user;
        }

        return null;
      },
    }),
  ],
};

but when I hard code the user as follows:
const user = {email: "email@email.com", and password: "password123"}
then perform this logic, the authorization works perfectly well.:

if (credentials?.email === user.email && credentials?.password == user.password) {
  return user;
}
return null;

How can I fix this?