首页 > 解决方案 > 如何在 Azure 部署上通过刷新解决 Angular 路由问题

问题描述

我有一个要部署到 Azure 云的 Angular(v7) 项目。我遇到路由问题。当我在其中一个子页面上刷新页面时,我得到:“您要查找的资源已被删除、名称已更改或暂时不可用。”

我看的是部署部署指令的角度指令

我也阅读了很多关于该问题的帖子,但我没有找到适合我的解决方案。

我的路由规则很简单。

export const AdminLayoutRoutes: Routes = [

    { path: '', redirectTo: 'dashboard', pathMatch: 'full'},
    { path: 'dashboard',      component: DashboardComponent },
    { path: 'contracts',      component: ContractsComponent }
];

我在“Src”文件夹中创建了 web.config 文件,内容如下:

<configuration>
    <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>
</configuration>

也放入 index.html

<base href='/'>

它没有帮助。还有什么可以检查的吗?

标签: angularazureangular-routing

解决方案


推荐阅读