Azure托管Angular应用web.config重写规则不生效解决方法

• 正则匹配逻辑错误：IIS重写的match url匹配的是域名后的相对路径（不带开头斜杠），原有正则(.*)/(assets/vid/.*.mp4)$多了一层斜杠分组，且.mp4前的通配符点没有转义，无法正确匹配目标路径。
• 模块执行顺序问题：Azure IIS默认对物理存在的静态文件会直接交给StaticFile模块返回响应，完全跳过URL重写流程，所以请求直接拿到了mp4文件，根本没走到你配置的规则。
• 缺失Angular SPA必需的路由回退规则，就算mp4重写生效，其他前端路由刷新时也会出现404错误。

• 替换src目录下的web.config内容为如下配置：

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
    <system.webServer>
        <rewrite>
            <rules>
                <rule name="Videos Reroute" stopProcessing="true">
                    <match url="^assets/vid/.*\.mp4$"  />
                    <action type="Rewrite" url="/"  />
                </rule>
                <rule name="Angular SPA Route" 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="/" />
                </rule>
            </rules>
        </rewrite>
        <handlers>
            <!-- 调整模块执行顺序，避免静态文件直接响应跳过重写规则 -->
            <remove name="StaticFile" />
            <add name="StaticFile" path="*" verb="*" modules="StaticFileModule,DefaultDocumentModule,DirectoryListingModule" resourceType="Either" requireAccess="Read" />
        </handlers>
    </system.webServer>
</configuration>

• 确认angular.json的打包配置正确，保证web.config会输出到dist根目录：找到对应项目构建配置里的assets数组，加入"src/web.config"项，参考配置片段：

"assets": [
  "src/favicon.ico",
  "src/assets",
  "src/web.config"
]

• 执行生产打包命令ng build --prod，将dist目录下的所有内容全量重新部署到Azure，部署后重启应用实例清掉IIS缓存，强制刷新浏览器再访问mp4路径验证即可。

如果部署后规则还是不生效，直接进Azure的Kudu高级工具，打开site/wwwroot目录，确认根目录下的web.config是最新版本，没有被旧部署文件覆盖。

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