本地环境NextAuth+Prisma集成时出现ERR_SSL_PROTOCOL_ERROR求助

问题场景 #

基于Next.js 13开发的应用，搭配MySQL数据库、NextAuth认证、Prisma ORM及适配器，按官方文档配置后出现以下问题：

• 点击默认NextAuth页面的「Sign in with Credentials」按钮，重定向到https://localhost:3000/api/auth/callback/credentials时触发ERR_SSL_PROTOCOL_ERROR，提示「This Site Can’t Provide a Secure Connection」
• 点击登出按钮时出现相同错误

已尝试的无效方案：

• 设置环境变量NODE_TLS_REJECT_UNAUTHORIZED=0关闭证书验证
• 在Chrome中手动忽略SSL错误
• 测试GitHub讨论区相关方案
• 更换Edge浏览器测试

核心原因 #

本地开发时Next.js默认使用HTTP协议，但NextAuth的回调地址被强制设置为HTTPS，协议不匹配导致SSL握手失败。

有效解决方案 #

1. 明确配置NEXTAUTH_URL为HTTP地址 #

在项目根目录的.env.local文件中添加或修改：

NEXTAUTH_URL=http://localhost:3000

NextAuth v4+虽支持自动检测地址，但本地环境下手动指定可避免因环境变量冲突或代理导致的HTTPS强制跳转。

2. 调整NextAuth配置，信任本地HTTP主机 #

在app/api/auth/[...nextauth]/route.ts（或pages目录下的[...nextauth].ts）中，修改认证配置：

import NextAuth from "next-auth";
import CredentialsProvider from "next-auth/providers/credentials";
import { PrismaAdapter } from "@next-auth/prisma-adapter";
import prisma from "@/lib/prisma";

export const authOptions = {
  adapter: PrismaAdapter(prisma),
  providers: [
    CredentialsProvider({
      name: "Credentials",
      credentials: {
        email: { label: "Email", type: "email" },
        password: { label: "Password", type: "password" },
      },
      async authorize(credentials) {
        if (!credentials?.email || !credentials?.password) return null;
        const user = await prisma.user.findUnique({
          where: { email: credentials.email },
        });
        // 此处补充密码校验逻辑（建议用bcrypt等加密库）
        return user;
      },
    }),
  ],
  session: {
    strategy: "jwt", // 若使用数据库session，确保Prisma模型符合要求
  },
  trustHost: true, // 允许NextAuth信任本地HTTP主机
  callbacks: {
    async redirect({ url, baseUrl }) {
      // 强制跳转地址使用本地HTTP协议
      if (url.startsWith("/")) return `${baseUrl}${url}`;
      return baseUrl;
    },
  },
};

export default NextAuth(authOptions);

3. 禁用Prisma数据库连接的SSL #

在.env文件的数据库连接字符串中添加sslmode=disable，避免Prisma强制使用SSL连接本地MySQL：

DATABASE_URL="mysql://你的用户名:你的密码@localhost:3306/数据库名?sslmode=disable"

4. 重启开发服务器 #

修改环境变量和配置后，必须完全关闭并重启Next.js开发服务器，确保新配置生效。

额外排查点 #

• 清除浏览器缓存和localhost相关Cookie，避免旧的HTTPS缓存残留导致跳转异常
• 关闭本地代理工具（如Charles、Fiddler），这类工具可能强制将HTTP请求转为HTTPS

内容的提问来源于stack exchange，提问作者Ezequiel González Macho