路由 IIS - Angular - Asp.Net Core

Question

我发布此消息是因为我没有找到任何可行的答案。 我正在使用 Angular 6、Asp.net Core 2.2 和 IIS 10 开发一个网站。 我的问题涉及直接在浏览器 url 输入区域中输入地址时的路由。使用网站，内部导航，一切正常。 我的网站计划是：

/ 
--> /upload
--> /admin
----> /admin/admincreateuser
----> /admin/manageuserlicencepanel

这是我的设置：

Angular 6

export const appRoutes: Routes = [
  {
    path: 'upload',
    runGuardsAndResolvers: 'always',
    canActivate: [AuthGuard],
    children: [
        {path: '', component: UploadComponent, data: {roles: ['Customer']} },
    ]
  },
  {
    path: 'admin',
    runGuardsAndResolvers: 'always',
    canActivate: [AuthGuard],
    children: [
        {path: '', component: AdminComponent, data: {roles: ['Admin', 'Moderator']}},
        {path: 'admincreateuser', component: AdminCreateUserComponent, data: {roles: ['Admin', 'Moderator']}},
        {path: 'manageuserlicencepanel', component: ManageUserLicencePanelComponent, data: {roles: ['Admin', 'Moderator']}}}}
    ]
  },
  {path: '', component: HomeComponent},
  {path: '**', redirectTo: '', pathMatch: 'full'}
];

ASP.Net Core 2.2

Startup.cs

public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
    app.UseMvc(routes =>
    {              
        routes.MapSpaFallbackRoute(
                    name: "spa-fallback",
                    defaults: new { controller="FallbackController", action = "Index"}
        );
    }
}

FallbackController.cs

public class FallbackController : Controller
{
    public IActionResult Index()
    {
        return PhysicalFile(Path.Combine(Directory.GetCurrentDirectory(), "wwwroot", "index.html"), "text/HTML");
    }
}

即使在 IIS 部署中，此配置也能正常工作。但是因为出现 404 错误，所以无法在地址栏中直接输入 url（即 https://www.dzfzx.com/upload ）。 为了解决这个问题，我尝试像这样在 IIS 中添加 URL 重写

   <system.webServer>
        <rewrite>
            <rewriteMaps>
              <rewriteMap name="^(.*)$" />
            </rewriteMaps>
            <rules>
                <rule name="All routes" stopProcessing="true">
                    <match url="^(.*)$" />
                    <action type="Rewrite" url="/" />
                    <conditions logicalGrouping="MatchAll">
                        <add input="{REQUEST_URI}" pattern="/api(.*)$" negate="true" />
                        <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
                        <add input="{REQUEST_URI}" pattern="^api/" negate="true" /> 
                    </conditions>
                </rule>
            </rules>
        </rewrite>
    </system.webServer>

通过实现我直接在主页上得到一个错误：

Uncaught SyntaxError: Unexpected token

还请注意，我似乎从不回退到我的 FallbackController 中，这似乎不正常。

您知道我如何使它工作（直接地址栏输入）吗？

谢谢。

Answer 1

您的配置似乎很糟糕。您应该将所有请求定向到 index.html，这是 angular 的索引文件。

试试这个配置：

<?xml version="1.0" encoding="utf-8"?>
<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>

Deploy an Angular Application to IIS