如何在 Google App Engine 上部署 Angular 多语言应用程序

Question

我已经使用angular/cli 和i18n multilanguage support 构建了我的Angular 8 应用程序（带有英语、西班牙语、法语的翻译）。

这样我就可以多次构建我的应用，每种语言一个，构建保存在dist/my-app/en、dist/my-app/es、dist/my-app/fr 等等...

现在我想在 Google App Engine 上部署我的应用程序，但我不明白我应该做什么/配置来部署我的应用程序的所有特定语言版本。

我已经在 GAE 上发布了我的默认（英文）版本并且它可以工作，但我不知道如何/在哪里部署所有其他版本（es、fr 等）。

我应该使用调度文件吗？你最好的方法是什么？

谢谢！

Answer 1

您可以将dist/my-app 视为有关 AppEngine 的根文件夹。

• 在此文件夹中添加一个 index.html（根据浏览器首选项或让用户选择重定向到默认语言环境）。
• 在 GAE 中将整个文件夹部署为一个应用程序。
• 每个本地化应用程序都将是子文件夹，然后由 GAE 提供为 https:///xxxx.appspot.com/en/...

要构建具有多个语言环境的多个应用程序，请查看Angular official docs。

每个 href 都应设置为语言环境：

"baseHref": "/en/",

然后，更新 app.yaml 和处理程序以服务所有子文件夹。

例如，这应该是这样的：

handlers:
- url: /fr/(.+)
  static_files: app/fr/index.html
  upload: app/fr/index.html
- url: /en/(.+)
  static_files: app/en/index.html
  upload: app/en/index.html
- url: /(.+)
  static_files: app/index.html
  upload: app/index.html
- url: /
  static_files: app/index.html
  upload: app/index.html

但我不是处理程序正则表达式的专家，所以我敢肯定它可以优化。

部署文件夹应如下所示：

deploy
  app.yaml
  app
    index.html // page to propose user to select locale or auto redirect
    fr
      index.html
      bundles.js...
    en
      index.html
      bundles.js...