多个 SPA 的 IIS 重写规则

Question

我们正在为我们的微前端创建一个新的架构，我们希望避免使用另一个框架来对其进行查询，例如 single-spa。我们公司目前在其他产品上使用 IIS，我们需要保持这种状态。

因此，为了让多个 SPA 响应同一个地址，我们只需将构建的 SPA 存放在 IIS 的内容目录中，如下所示：

IIS 根文件夹：

spa1
spa2

我可以正常访问 myhost/spa1 和 myhost/spa2，并通过它们自己的内部路由进行导航（我们正在使用 Angular）。

问题是，我们想要没有 # 的 URL，并且我们需要告诉 IIS 将任何子路由重定向到它的 SPA 主路由。

我们有一些东西，它适用于 myhost/spa1、myhost/spa1/detail，但不适用于 myhost/spa1/detail/1。比方说，第三层。

有人可以帮我解决这个问题吗？

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
    <system.webServer>
        <rewrite>
            <rules>
                <rule name="SPA Rule" 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="{R:1}/" />
                </rule>
            </rules>
        </rewrite>
        <directoryBrowse enabled="true" />
    </system.webServer>
</configuration>

Answer 1

尝试使用此 URL 重写规则：

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
    <system.webServer>
        <rewrite>
            <rules>
                <rule name="SPA Rule" 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="{R:1}/{R:2}" />
                </rule>
            </rules>
        </rewrite>
        <directoryBrowse enabled="true" />
    </system.webServer>
</configuration>

Answer 2

经过几次试验和另一个要求（我们需要在 URL 中选择一个“公司”），我想出了一些非常有效的方法：

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
    <system.webServer>
        <rewrite>
            <rules>
                <rule name="Application Hub Rule" stopProcessing="true">
                    <match url="(hub)(/?.*)" />
                    <conditions logicalGrouping="MatchAll">
                        <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
                        <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
                    </conditions>
                    <action type="Rewrite" url="{R:1}/" />
                </rule>
                <rule name="CRM Customer Rule" stopProcessing="true">
                    <match url="(crm/customer)(/?.*)" />
                    <conditions logicalGrouping="MatchAll">
                        <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
                        <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
                    </conditions>
                    <action type="Rewrite" url="{R:1}/" />
                </rule>
            </rules>
        </rewrite>
    </system.webServer>
</configuration>

我知道这是非常独特的要求。但事实证明这些规则运作良好。一旦用户输入 my-host/COMP_CODE/hub，我的 Angular 应用程序就会处理 URL 更改，因为 my-host/COMP_CODE/hub/**/** 之后的所有内容都被 IIS 重定向到集线器的根文件夹。一旦您输入 my-host/COMP_CODE/crm/customer 及其子路由，IIS 会将所有内容重定向到客户的根文件夹，并且 Angular 负责 URL 更改。

唯一的问题是，在您的 Angular 的 RouterModule.forRoot() 配置中，您需要确保 Angular 的路由器理解 path: ':db/hub'（以及其他事项）。

感谢那些试图提供帮助的人。

多个 SPA 的 IIS 重写规则

IIS Rewrite rule for multiple SPAs

iis

angular

single-spa