next.js与自定义express/node.js部署在Azure上

7cjasjjr 于 2023-06-22 发布在 Node.js

关注(0)|答案(1)|浏览(119)

我试图部署一个在前端使用Next.js（带有一些getStaticProps函数）并在Azure上使用自定义express/node.js后端的应用程序。它也使用MySQL（但我不认为这与我的问题有关）。问题是，当我在Azure上部署它时，我在网页上看到“您没有权限查看此目录或页面。”我的express文件包含了所有的路由和请求，它位于一个名为server的文件夹中，文件本身名为index.js。我也有一个web.config文件，看起来像这样：

<configuration>
      <system.webServer>
        <handlers>
          <add name="iisnode" path="server/index.js" verb="*" modules="iisnode" />
        </handlers>
        <rewrite>
          <rules>
            <rule name="NodeServer" patternSyntax="ECMAScript" stopProcessing="true">
              <match url="server/index.js" />
              <action type="Rewrite" url="server/index.js" />
            </rule>
            <rule name="NextJsRouting" patternSyntax="ECMAScript" stopProcessing="true">
              <match url="^(.*)$" ignoreCase="false" />
              <conditions logicalGrouping="MatchAll">
                <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
                <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
              </conditions>
              <action type="Rewrite" url="server/index.js" />
            </rule>
          </rules>
        </rewrite>
        <iisnode nodeProcessCommandLine="&quot;C:\Program Files\nodejs\node.exe&quot;" />
      </system.webServer>
    </configuration>

我有一个iisnode.yml文件，看起来像这样：

nodeProcessCommandLine: "node server/index.js"

package.json文件看起来像这样：

{
      "name": "endelig",
      "version": "0.1.0",
      "private": true,
      "scripts": {
        "dev": "nodemon server/index.js",
        "build": "next build",
        "start": "next start",
        "lint": "next lint"
      },
      "dependencies": {
        "@next/font": "13.1.6",
        "@stripe/react-stripe-js": "^2.1.0",
        "@stripe/stripe-js": "^1.52.0",
        "bcrypt": "^5.1.0",
        "cookie-parser": "^1.4.6",
        "dotenv": "^16.0.3",
        "express": "^4.18.2",
        "jsonwebtoken": "^9.0.0",
        "micro": "latest",
        "micro-cors": "latest",
        "mysql": "^2.18.1",
        "next": "^13.1.6",
        "nodemailer": "^6.9.1",
        "react": "18.2.0",
        "react-dom": "18.2.0",
        "stripe": "^11.17.0"
      }
    }

jsconfig.js文件看起来像这样：

{
      "compilerOptions": {
        "baseUrl": ".",
        "paths": {
          "@/*": ["./*"]
        }
      }
    }

我已经配置了所有的环境变量，以及在网络应用程序在azure以及顺便说一句。我被困了几天了，如果你能帮忙我会非常感激的。
在Azure上部署。失败并获取（您没有权限查看此目录或页面）。在网页上

node.js

来源：https://stackoverflow.com/questions/76474119/next-js-with-custom-express-node-js-deployment-on-azure

1条答案

按热度按时间

7jmck4yq1#

我尝试在Azure DevOps管道中使用nodejs在Azure Web应用程序中部署Next.js Web应用程序，并取得了成功：

确保在构建Artifact时，它被正确地压缩到正确的目录结构中，作为您的本地代码。并且在将工件推到部署时没有丢失任何文件：

trigger:
- main

variables:

  # Azure Resource Manager connection created during pipeline creation
  azureSubscription: 'xxxxxxxx94e94d93'

  # Web app name
  webAppName: 'siliconwebapp655'

  # Environment name
  environmentName: 'siliconwebapp655'

  # Agent VM image name
  vmImageName: 'ubuntu-latest'

stages:
- stage: Build
  displayName: Build stage
  jobs:
  - job: Build
    displayName: Build
    pool:
      vmImage: $(vmImageName)

    steps:
    - task: NodeTool@0
      inputs:
        versionSpec: '18.x'
      displayName: 'Install Node.js'

    - script: |
        npm install
        npm run build --if-present
        npm run test --if-present
      displayName: 'npm install, build and test'

    - task: ArchiveFiles@2
      displayName: 'Archive files'
      inputs:
        rootFolderOrFile: '$(System.DefaultWorkingDirectory)'
        includeRootFolder: false
        archiveType: zip
        archiveFile: $(Build.ArtifactStagingDirectory)/$(Build.BuildId).zip
        replaceExistingArchive: true

    - upload: $(Build.ArtifactStagingDirectory)/$(Build.BuildId).zip
      artifact: drop

- stage: Deploy
  displayName: Deploy stage
  dependsOn: Build
  condition: succeeded()
  jobs:
  - deployment: Deploy
    displayName: Deploy
    environment: $(environmentName)
    pool:
      vmImage: $(vmImageName)
    strategy:
      runOnce:
        deploy:
          steps:
          - task: AzureWebApp@1
            displayName: 'Azure Web App Deploy: siliconwebapp655'
            inputs:
              azureSubscription: $(azureSubscription)
              appType: webAppLinux
              appName: $(webAppName)
              runtimeStack: 'NODE|18.10'
              package: $(Pipeline.Workspace)/drop/$(Build.BuildId).zip
              startUpCommand: 'next start'

在上述管道中，我正在构建应用程序，然后将其从System.DefaultWorkingDirectory存档到$(Build.ArtifactStagingDirectory)/$(Build.BuildId).zip，并将构建工件上传到放置文件夹，并在AzureWebApp@1部署任务中使用相同的文件夹$(Pipeline.Workspace)/drop/$(Build.BuildId).zip

您没有权限查看此目录或页面
为了解决此错误，请参考我的SO线程答案***此处***
根据答案：
通过访问开发工具>高级工具> Kudu > Go > Site wwwroot >检查文件是否正确部署

验证上面是否正确部署了所有文件。如果没有，请在新的Azure Web应用程序中重新运行部署。
通过单击Kudu工具中的部署检查日志并检查：-
联系我们

https://azure-webapp-name.scm.azurewebsites.net/api/deployments

我的应用设置：-

另外，请参考此SO thread中的答案

赞(0）回复(0）举报 2023-06-22

我来回答

next.js与自定义express/node.js部署在Azure上

1条答案

相关问题

热门标签

最新问答