.net-core - 部署到 Azure 后，在 Angular 7 中使用 i18n 的本地化不起作用

Question

我正在关注这个 link使用 i18n 在 Angular 中实现本地化。

当我导航到“url/en”或“url/fr”时，它没有指向相应的目录文件夹，而是尝试搜索路径并给出以下错误消息。

core.js:15723 ERROR Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: 'fr'

我使用 VS2019 创建了这个 Angular 7 项目。对于后端，我使用的是 asp.net core 2.2 web api。

运行以下命令会在本地显示具有正确翻译的页面。

ng serve --configuration=fr

我的 angular.json 文件如下所示。

我的Package.json文件如下图

我已经在 app.modules.ts 中以这种方式配置了路由

RouterModule.forRoot([
  {
    path:'',      
    component:HomeComponent,
    canActivate:[AuthGuard]
  },

我是这样修改.csproj文件的。

  <Target Name="PublishRunWebpack" AfterTargets="ComputeFilesToPublish">
<!-- As part of publishing, ensure the JS resources are freshly built in production mode -->
<Exec WorkingDirectory="$(SpaRoot)" Command="npm install" />
<Exec WorkingDirectory="$(SpaRoot)" Command="npm run build-locale" />
<Exec WorkingDirectory="$(SpaRoot)" Command="npm run build-locale:ssr" Condition=" '$(BuildServerSideRenderer)' == 'true' " />

这是我的目录结构

Answer 1

看起来您应该覆盖 Web 服务器级别的 url。例如添加 web.config:

    <rule name="FR Rule" stopProcessing="true">
      <match url="(fr/)" />
      <conditions logicalGrouping="MatchAll">
        <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
        <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
      </conditions>
      <action type="Rewrite" url="/fr/" />
    </rule>