Vercel部署NextAuth Email Provider出现404及客户端请求错误

1. 检查Vercel部署配置的构建命令与输出目录 #

• 确认Vercel项目设置里的Build Command是next build，Output Directory留空（Next.js默认处理，无需手动指定）。若之前修改过这些配置，可能导致API路由未被正确打包。
• 查看Vercel部署日志，搜索API routes相关输出，确认是否有Exporting routes记录，以及NextAuth的/api/auth/[...nextauth]是否被正确识别。

2. 验证Next.js版本与Vercel适配性 #

• 若近期升级过Next.js，部分新版本可能和Vercel部署环境存在兼容性问题。可尝试锁定到之前能正常运行的版本（比如从13.x降级到12.x），重新部署测试。
• 检查next.config.js是否启用了output: 'export'静态导出模式——静态导出会禁用API路由，这是API 404的常见诱因，若有则需移除该配置（NextAuth依赖服务器端API路由）。

3. 核对环境变量的Vercel配置 #

• 尽管你已配置NEXTAUTH_URL和NEXTAUTH_SECRET，仍需确认Vercel的Environment Variables中这些变量是在Production环境下设置的，而非仅在Development环境。可在Vercel项目的Settings > Environment Variables中查看，确保生产环境变量已正确添加并在部署时生效。
• NEXTAUTH_URL必须是你的Vercel部署域名（如https://your-project.vercel.app），不要带路径，也不能用localhost。

4. 确认API路由文件路径与命名 #

• 再次核对NextAuth的路由文件路径：若使用Pages Router，需在pages/api/auth/[...nextauth].js（或.ts）；若使用Next.js 13 App Router，路径应为app/api/auth/[...nextauth]/route.js（或.ts），不要混淆两种路由体系的文件位置。
• 检查所有API路由文件是否存在语法错误，比如未正确导出GET/POST函数，或文件扩展名错误（比如写成.jsx而非.js）。

5. Vercel平台侧排查 #

• 触发一次重新部署，并取消勾选Use existing build cache，强制重新构建，避免缓存导致的异常。
• 查看Vercel项目的Functions页面，确认是否有API路由对应的Serverless Function被创建。若没有，说明构建过程未生成对应函数，需回到构建日志查找原因。
• 若以上操作均无效，可联系Vercel支持，提供项目ID和部署日志，排查是否为平台侧临时故障或配置异常。

内容的提问来源于stack exchange，提问作者sciffany