Angular 16.2 SSR应用部署Azure App Service后权限问题求助

核心问题 #

你的部署目录结构和启动配置存在两处关键错误：

1. 目录层级错误：server.ts被放置在wwwroot/dist/下，而Angular SSR的入口文件需要与dist/Dashboard目录同级（即wwwroot/根目录），否则Node.js无法正确加载构建后的SSR产物。
2. 缺失必要文件：未部署package.json，Azure App Service无法识别项目依赖和启动逻辑；同时prerender.js并非SSR必需文件，无需部署。

修复步骤 #

1. 修正Azure DevOps流水线的文件复制逻辑 #

替换原有的CopyFiles任务，确保文件结构符合SSR部署要求：

- task: CopyFiles@2
  displayName: 'Copy SSR Build Artifacts'
  inputs:
    SourceFolder: '$(Build.SourcesDirectory)/Dashboard'
    Contents: |
      dist/**
      server.ts
      package.json
      package-lock.json
    TargetFolder: '$(Build.ArtifactStagingDirectory)/app'

部署后wwwroot的正确结构：

wwwroot/
|--> dist/
|-------> Dashboard/
|-------------> browser/
|-------------> server/
|--> server.ts
|--> package.json

2. 调整Azure App Service部署配置 #

确认AzureRmWebAppDeployment任务的启动文件路径正确：

- task: AzureRmWebAppDeployment@3
  displayName: 'Azure App Service Deploy'
  inputs:
    azureSubscription: 'Dashboard Deployment'
    appType: 'app'
    WebAppName: 'DashboardDFIDTest'
    Package: '$(Build.ArtifactStagingDirectory)/app'
    ConfigurationSettings: '-Handler iisnode -NodeStartFile server.ts -appType node'

此时NodeStartFile指向wwwroot/server.ts，与dist目录同级，符合Angular SSR的加载逻辑。

3. 验证App Service Node.js版本 #

在Azure门户的App Service配置中，进入设置 > 常规设置，确认Node.js版本为18.x（与流水线使用的Node 18.17.0一致），避免版本不兼容问题。

4. （可选）添加自定义web.config #

如果上述步骤后仍有问题，在项目根目录添加web.config文件，然后在流水线中一并复制：

<?xml version="1.0" encoding="utf-8"?>
<configuration>
  <system.webServer>
    <handlers>
      <add name="iisnode" path="server.ts" verb="*" modules="iisnode"/>
    </handlers>
    <rewrite>
      <rules>
        <rule name="DynamicContent">
          <match url="/*" />
          <action type="Rewrite" url="server.ts"/>
        </rule>
      </rules>
    </rewrite>
    <iisnode nodeProcessCommandLine="&quot;%ProgramFiles%\nodejs\node.exe&quot;" />
  </system.webServer>
</configuration>

只需在CopyFiles任务的Contents中添加web.config即可。

额外建议 #

• 移除流水线中无用的dir脚本任务，精简流水线。
• 考虑使用npm run build:ssr后直接打包项目根目录的必要文件，避免手动复制遗漏。

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