在 IIS 上为 Angular 应用程序配置反向代理的问题

Question

我目前在 IIS 上为 Angular 应用程序配置反向代理时遇到问题。我有多个微前端 Angular 应用程序，其中一个主机应用程序使用地址 http://192.168.1.104:8081 发布在 IIS 上，另一个远程应用程序发布在 http://192.168.1.104:8080 上。我尝试在本地主机上配置代理，使用以下配置可以正常工作：

proxy.config.json:
    {
      "/assets/nahal": {
        "target": "http://localhost:4202",
        "secure": false,
        "changeOrigin": true,
        "pathRewrite": {
          "^/fonts": "/assets/nahal/fonts"
        }
      }
    }

ng服务--proxy-config proxy.conf.json

但是，当我尝试使用 web.config 文件在 IIS 上复制此配置时，我在访问远程应用程序时遇到了问题。这是我尝试过的 web.config 文件：

<?xml version="1.0" encoding="utf-8"?>
<configuration>
  <system.webServer>
    <proxy enabled="true" />
    <rewrite>
      <rules>
        <rule name="Reverse Proxy to remote app" stopProcessing="true">
          <match url="^assets/nahal/(.*)" />
          <action type="Rewrite" url="http://192.168.1.104:8080/{R:1}" />
        </rule>
      </rules>
    </rewrite>
  </system.webServer>
</configuration>

预期的行为是使用类似 http://192.168.1.104:8081/assets/nahal/img/nahal.png 的 URL 访问远程应用程序，但即使请求状态为200.

有人可以提供有关如何在 IIS 上为 Angular 应用程序正确配置反向代理的指导吗？任何帮助将不胜感激！

Answer 1

我自己找到了解决方案！如果其他人遇到类似的问题，我已在 GitHub 存储库中记录了这些步骤：Angular Micro Frontend。请随意查看有关如何在 IIS 上为 Angular 应用程序正确配置反向代理的详细说明。希望有帮助！