Next.js集成Auth0部署Vercel后登录回调出现400 GET错误

以下是针对该问题的排查和解决步骤：

• 修正.env.production变量引用格式
  你的.env.production中AUTH0_ISSUER_BASE_URL={AUTH0_ISSUER_BASE_URL}缺少$符号，会导致Vercel无法正确读取对应环境变量，应修改为：

  AUTH0_SECRET=${AUTH0_SECRET}
  AUTH0_BASE_URL=${AUTH0_BASE_URL}
  AUTH0_ISSUER_BASE_URL=${AUTH0_ISSUER_BASE_URL}
  AUTH0_CLIENT_ID=${AUTH0_CLIENT_ID}
  AUTH0_CLIENT_SECRET=${AUTH0_CLIENT_SECRET}
  

• 确认Vercel环境变量的实际值
  进入Vercel项目的「Settings → Environment Variables」页面，逐一核对以下变量：

  • AUTH0_BASE_URL必须设置为线上应用的完整域名（如https://your-app.vercel.app），不能使用本地地址
  • AUTH0_ISSUER_BASE_URL要与Auth0控制台中应用的Issuer地址完全一致（如https://your-domain.auth0.com）
  • AUTH0_SECRET需和本地.env.local中的值完全相同，建议用openssl rand -hex 32生成32位以上随机字符串

• 检查Auth0控制台的授权配置
  登录Auth0应用后台，在「Application Settings」中确认：

  • Allowed Callback URLs已添加线上回调地址：https://your-app.vercel.app/api/auth/callback
  • Allowed Web Origins和Allowed Logout URLs也包含线上域名，避免跨域或登出问题

• 清除Vercel部署缓存
  重新部署项目时，勾选「Redeploy with cache cleared」选项，确保新的环境变量配置被正确加载，避免缓存导致的变量未更新问题

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