azure-devops - 在 Azure Web 应用服务中部署 Angular 13 通用应用

Question

我正在尝试使用 azure devops 管道在 Azure Web 应用程序服务中部署 Angular 13 通用应用程序，但在尝试访问 azure webapp 时出现以下错误。

You do not have permission to view this directory or page.

正如我在天蓝色管道下面写的那样 -

# Node.js with Angular
# Build a Node.js project that uses Angular.
# Add steps that analyze code, save build artifacts, deploy, and more:
# https://learn.microsoft.com/azure/devops/pipelines/languages/javascript

trigger:
- master

pool:
  vmImage: windows-latest

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

- script: |
    npm install -g @angular/cli
  displayName: 'npm install cli'

- script: |
   npm install
  displayName: 'npm install'

- script: |
    npm run build:ssr --prod
  displayName: 'npm build'
- task: PowerShell@2
  inputs:
    targetType: 'inline'
    script: 'echo $pwd.Path echo "::set-output name=PWD::$pwd"'

- task: CopyFiles@2
  displayName: 'Copy browser directory from dist directory to the root'
  inputs:
    Contents: '$(Build.SourcesDirectory)/dist/app/browser'
    TargetFolder: '$(Build.ArtifactStagingDirectory)/dist/app/browser'


- task: CopyFiles@2
  displayName: 'Copy main.js to the root'
  inputs:
    SourceFolder: '$(System.DefaultWorkingDirectory)/dist/app/server'
    Contents:  main.js
    TargetFolder: '$(Build.ArtifactStagingDirectory)'

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

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


- task: AzureRmWebAppDeployment@4
  inputs:
    ConnectionType: 'AzureRM'
    azureSubscription: 'appconnection'
    appType: 'webApp'
    WebAppName: 'appwebsite'
    packageForLinux: '$(Build.ArtifactStagingDirectory)/$(Build.BuildId).zip'

还尝试了下面提到的另一个管道 -

# Node.js with Angular
# Build a Node.js project that uses Angular.
# Add steps that analyze code, save build artifacts, deploy, and more:
# https://learn.microsoft.com/azure/devops/pipelines/languages/javascript

trigger:
- master

pool:
  vmImage: windows-latest

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

- script: |
    npm install @angular/cli -g
  displayName: 'npm install cli'

- script: |
   npm install
  displayName: 'npm install'


- script: |
    npm run build:ssr
  displayName: 'build the projec'


#- task: PowerShell@2
#  inputs:
#    targetType: 'inline'
#    script: 'echo $pwd.Path echo "::set-output name=PWD::$pwd"'

- task: CopyFiles@2
  displayName: 'Copy browser directory from dist directory to the root'
  inputs:
    SourceFolder: '$(Build.SourcesDirectory)/dist'
    TargetFolder: '$(Build.ArtifactStagingDirectory)/app/dist'


- task: CopyFiles@2
  displayName: 'Copy main.js to the root'
  inputs:
    SourceFolder: '$(Build.ArtifactStagingDirectory)/app/dist'
    Contents:  main.js
    TargetFolder: '$(Build.ArtifactStagingDirectory)/app'

- task: DeleteFiles@1
  displayName: 'Delete the dist/main.js'
  inputs:
    SourceFolder: '$(Build.ArtifactStagingDirectory)/app/dist'
    Contents: 'main.js'


- task: AzureRmWebAppDeployment@4
  inputs:
    ConnectionType: 'AzureRM'
    azureSubscription: 'appconnection'
    appType: 'webApp'
    WebAppName: 'appwebsite1'
    deployToSlotOrASE: true
    ResourceGroupName: 'RG-app'
    SlotName: 'production'
    packageForLinux: '$(Build.ArtifactStagingDirectory)/app'
    WebConfigParameters: '-Handler iisnode -NodeStartFile server.js -appType node'
    enableCustomDeployment: true
    DeploymentType: 'webDeploy'
    RemoveAdditionalFilesFlag: true

如果两个管道都成功运行，但无法从其中任何一个管道访问网络应用程序，请在此提出任何建议，我在这里到底做错了什么。

Answer 1

You do not have permission to view this directory or page.

将我们的讨论作为答案发布，以便对其他社区成员有所帮助。

• 验证是否已部署所有文件夹。
• 确保文件夹/文件/目录结构的格式正确。
• web.config 必须位于根目录中。
• 检查部署的文件夹结构中是否存在指定的默认文档。
• 在配置 => 路径映射下的门户中添加虚拟目录路径 /