Question

在我服务的网站上单击任何链接时，它们会起作用。但是，使用ng build后，所有页面链接均无效。该网站为hiphost.co.za，如果您想自己进行测试并查看。

这是我的路由器的代码：

RouterModule.forRoot([
      {
        path: '',
        redirectTo: '/home',
        pathMatch: 'full'
      },
      {
        path: 'home',
        component: HomeComponent,
        pathMatch: 'full'
      },
      {
        path: 'terms-and-conditions',
        component: TermsAndConditionsComponent
      },
      {
        path: 'privacy',
        component: PrivacyPolicyComponent
      },
      {
        path: 'about',
        component: AboutComponent
      },
      {
        path: 'contact',
        component: ContactComponent
      },
      {
        path: 'team',
        component: TeamComponent
      },
      {
        path:'safety',
        component: SafetyComponent
      }
    ]

）

因此，当您访问hiphost时，它会自动重定向到/ home，然后从那里的链接将无效

Answer 1

所有路由请求都由服务器而不是您的应用程序处理，因此为404。

最简单的解决方案是引导服务器将所有请求重定向到index.html，以便您的路由器可以处理它。

Answer 2

在生产中，Angular应用程序由Web服务器托管。因此，当您重定向到任何嵌套视图时。 Web服务器无法识别路径并抛出404错误。请点击此链接以了解如何告诉Web服务器导航到嵌套视图。

Rewriting URL for angular app in production

Answer 3

您需要在web.config文件中

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

您还需要将其添加到index.html。

<base href="/">

页面链接在域的角度构建中不起作用

3 个答案: