Azure中托管的Angular路由回退页面无法正常工作

我最近刚搞定Azure上IIS部署Angular项目的路由配置，全程跟着Angular官方文档和Stack Overflow的建议来做，特意没碰哈希路由——毕竟官方明确说了除非绝对必要，不然尽量避开这个策略。部署步骤是参照一篇Azure Angular部署的博客来的，核心就是把回退页面设为index.html，确保单页应用的路由能正常工作。

我已经确认index.html的base href配置没问题（比如根目录部署的话就是<base href="/">），然后给项目加了完整的web.config配置，用来处理路由重写：

<system.webServer>
  <rewrite>
    <rules>
      <rule name="Angular Routes" stopProcessing="true">
        <match url=".*" />
        <conditions logicalGrouping="MatchAll">
          <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
          <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
        </conditions>
        <action type="Rewrite" url="/index.html" />
      </rule>
    </rules>
  </rewrite>
</system.webServer>

这里几个关键配置得说清楚：

• stopProcessing="true"：匹配到这条规则后就停止处理后续规则，防止其他重写规则干扰Angular的路由逻辑
• <match url=".*" />：捕获所有进来的请求URL
• 条件判断部分：专门排除了真实存在的文件和目录，这样像JS、CSS、图片这些静态资源能正常返回，不会被强制重写到index.html
• 重写动作：把所有不符合上面条件的请求（也就是Angular路由定义的路径）转发到index.html，让Angular自己的路由系统来处理页面跳转

部署完之后记得测试一下：直接访问某个路由路径（比如/user/profile），看看是不是能正常加载页面而不是跳404；同时检查静态资源是否能正常加载，确保没有因为重写规则影响到这些资源的访问。

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