Next.js部署到Azure Web App时出现Auth0 domain required错误如何解决

算力阿峰

2026-10-2

问题根因

报错发生在GitHub Actions的构建阶段，而非Azure运行阶段：

Azure的应用程序设置是应用运行时的环境变量，不会注入到GitHub Actions的构建环境中
Next.js在执行npm run build时就需要读取Auth0相关的环境变量，构建环境缺失对应变量就会触发domain必填的报错
额外的superagent警告是因为你在服务端渲染逻辑中直接初始化了仅浏览器可用的auth0-js库

解决方案

1. 配置GitHub仓库密钥

进入你的GitHub仓库，依次点击「Settings」→「Secrets and variables」→「Actions」，点击「New repository secret」，将你本地.env文件中的所有Auth0相关变量逐个添加为仓库密钥，比如：

AUTH0_DOMAIN
AUTH0_CLIENT_ID
其他你用到的Auth0相关变量
注意：如果变量需要在Next.js客户端代码中使用，变量名必须以NEXT_PUBLIC_为前缀，否则构建时不会被注入到客户端代码中

2. 修改GitHub Actions工作流配置

更新你的workflow.yml文件，在构建步骤中注入上述密钥作为环境变量：
找到npm install, build, and test对应的步骤，修改为以下内容：

- name: npm install, build, and test
  env:
    AUTH0_DOMAIN: ${{ secrets.AUTH0_DOMAIN }}
    AUTH0_CLIENT_ID: ${{ secrets.AUTH0_CLIENT_ID }}
    # 其他你用到的环境变量都按上面的格式加在这里，变量名要和你代码中使用的完全一致
  run: |
    npm install
    npm run build --if-present
    npm run test --if-present

3. 修正auth0-js初始化逻辑

auth0-js是仅浏览器端可用的库，不要在服务端渲染/静态生成的逻辑中直接初始化，添加浏览器环境判断再初始化实例：

let webAuth = null
if (typeof window !== 'undefined') {
  // 只有在浏览器环境才初始化WebAuth
  webAuth = new auth0.WebAuth({
    domain: process.env.NEXT_PUBLIC_AUTH0_DOMAIN,
    clientID: process.env.NEXT_PUBLIC_AUTH0_CLIENT_ID,
    // 其他配置项
  })
}