从Vercel迁移Next.js至Azure Web App遇端口探测失败问题及解决

将Next.js应用从Vercel迁移至Azure Web App，已通过GitHub Actions配置CI/CD，构建与部署任务均执行成功，但Azure启动日志中持续出现端口探测失败错误：didn't respond to HTTP pings on port: 8080, failing site start。

最初判断是Next.js默认使用端口3000导致不匹配，在Azure环境变量中添加WEBSITES_PORT=3000后，错误变为didn't respond to HTTP pings on port: 3000, failing site start，问题仍未解决。

注：代码库未自行使用Docker，日志中的docker run -d --expose=8080为Azure自动生成。

Azure错误日志 #

2025-02-21T23:36:06.839Z INFO  - Stopping site appname because it failed during startup.
2025-02-21T23:47:17.229Z INFO  - Starting container for site
2025-02-21T23:47:17.237Z INFO  - docker run -d --expose=8080 --name appname_1_86d342a9 -e WEBSITE_USE_DIAGNOSTIC_SERVER=true -e WEBSITES_PORT=8080 -e WEBSITE_SITE_NAME=appname -e WEBSITE_AUTH_ENABLED=False -e PORT=8080 -e WEBSITE_ROLE_INSTANCE_ID=0 -e WEBSITE_HOSTNAME=appname-eeg0cha0cfh3d43b9.uksouth-01.azurewebsites.net -e WEBSITE_INSTANCE_ID=2a8f5b2341b72347f9c6e13dac66a7d1428460c1a4c8a1b3534f1beafa4249f1 -e HTTP_LOGGING_ENABLED=1 appsvc/node:20-lts_20250213.3.tuxprod
2025-02-21T23:47:24.355Z INFO  - Initiating warmup request to container appname_1_86d342a9 for site appname
2025-02-21T23:47:41.757Z INFO  - Waiting for response to warmup request for container appname_1_86d342a9. Elapsed time = 17.3826041 sec
2025-02-21T23:47:51.526Z ERROR - Container appname_1_86d342a9 for site appname has exited, failing site start
2025-02-21T23:47:51.553Z ERROR - Container appname_1_86d342a9 didn't respond to HTTP pings on port: 8080, failing site start. See container logs for debugging.

原GitHub Actions Workflow配置 #

name: Build and deploy Node.js app to Azure Web App

on:
  push:
    branches:
      - master
  workflow_dispatch:

jobs:
  build:
    runs-on: ubuntu-latest
    permissions:
      contents: read
    steps:
      - uses: actions/checkout@v4

      - name: Set up Node.js version
        uses: actions/setup-node@v3
        with:
          node-version: '20.x'
          cache: 'npm'

      - name: npm install, build, and test
        run: |
          npm ci          
          npm run build --if-present
          npm run test --if-present
          npm prune --production 

      - name: Zip artifact for deployment
        run: |
          # Adjust paths to include only necessary files (e.g., package.json, build output, node_modules)
          zip -r release.zip package*.json dist/ node_modules/ -i '*.js' '*.json' '*.html' '*.css' # Example, customize based on your project

      - name: Upload artifact for deployment job
        uses: actions/upload-artifact@v4
        with:
          name: node-app
          path: release.zip

  deploy:
    runs-on: ubuntu-latest
    needs: build
    environment:
      name: 'Production'
      url: ${{ steps.deploy-to-webapp.outputs.webapp-url }}
    steps:
      - name: Download artifact from build job
        uses: actions/download-artifact@v4
        with:
          name: node-app

      - name: 'Deploy to Azure Web App'
        id: deploy-to-webapp
        uses: azure/webapps-deploy@v3
        with:
          app-name: 'app-name'
          slot-name: 'Production'
          package: release.zip
          publish-profile: ${{ secrets.AZUREAPPSERVICE_PUBLISHPROFILE }}

解决方案 #

1. 配置启动脚本 #

在项目根目录的package.json中添加start命令：

"scripts": {
  // 其他脚本...
  "start": "node_modules/next/dist/bin/next start"
}

2. 修改GitHub Actions构建流程 #

移除原打包zip的步骤，改用Next.js的standalone部署模式，优化构建产物：

# 替换原Zip和Upload步骤为以下内容
- name: Copy static files
  run: |
    cp -R ./.next/static ./.next/standalone/.next/static

- name: Upload artifact for deployment job
  uses: actions/upload-artifact@v4
  with:
    name: node-app
    path: ./.next/standalone
    include-hidden-files: true

3. 更新部署任务 #

将deploy阶段的package: release.zip改为指向standalone目录：

- name: 'Deploy to Azure Web App'
  id: deploy-to-webapp
  uses: azure/webapps-deploy@v3
  with:
    app-name: 'app-name'
    slot-name: 'Production'
    package: ./.next/standalone
    publish-profile: ${{ secrets.AZUREAPPSERVICE_PUBLISHPROFILE }}

效果说明 #

调整后构建+部署总时长从原来的35分钟缩短至3分钟，推测原问题是因部署包过大（包含完整node_modules）导致Azure启动超时，端口探测未及时得到响应。

内容的提问来源于stack exchange，提问作者Antonio Andrés