在 Digital Ocean 应用平台上刷新 Angular SPA 时出现 404 页面

Question

我一直在新的数字海洋应用程序平台上作为静态站点测试 Angular 单页应用程序。

当我访问根 URL 并通过单击链接导航到不同页面时，Angular 应用程序加载正常。但是，当我在任何页面上刷新浏览器时，都会收到 404 错误。

数字海洋应用平台需要nginx.conf文件吗？我是否缺少需要在环境中启用 Pushstate 的步骤？

Answer 1

编辑：

您现在可以正式使用catchall_document财产而不是error_document按照本说明使用。

我认为应用程序平台中的官方 SPA 目前是不可能的。更多信息请参见https://www.digitalocean.com/community/questions/digital-ocean-apps-spa-application

但目前有一个解决方法。

创建app.yaml文件

name: APP_NAME
region: fra
static_sites:
- build_command: |-
    git init
    git clean  -d  -f .
    git remote add origin https://github.com/REPOSITORY
    git fetch origin $BRANCH_NAME
    git checkout $COMMIT_SHA
    npm install
    npm install -g @angular/cli
    ng build --prod
  environment_slug: node-js
  github:
    branch: master
    deploy_on_push: true
    repo: REPOSITORY
  name: APP_NAME
  error_document: index.html
  routes:
  - path: /

在此文件中，我们设置error_document为index.html（我们的索引文件）。现在每个页面都重定向到索引文件。

然后你必须运行 doctl 命令来使用app.yaml文件创建新的应用程序。您必须使用此命令才能应用此配置文件。

doctl apps create --spec app.yaml

之后转到您的应用程序平台仪表板，您可以看到您的 SPA 应用程序

如何设置doctl？https://www.digitalocean.com/docs/apis-clis/doctl/how-to/install/

如何查看我当前的.yaml设置？在应用程序仪表板中单击“设置”选项卡，然后在“应用程序规格”行中单击“视图”

就是这样