GCP App Engine / Angular - 无法加载模块脚本：服务器以“text/html”的非 JavaScript MIME 类型响应

Posted 2023-02-26

【中文标题】GCP App Engine / Angular - 无法加载模块脚本：服务器以“text/html”的非 JavaScript MIME 类型响应

【英文标题】：GCP App Engine / Angular - Failed to load module script: The server responded with a non-JavaScript MIME type of "text/html"

【发布时间】：2020-09-10 04:19:51

【问题描述】：

我正在尝试使用 App Engine 在 Google Cloud Platform 上托管 Angular 应用。问题是，在我成功部署它之后，我可以访问它大约 2-3 分钟，点击刷新并没有收到 HTTP 错误 404，但是在这 2-3 分钟之后，我在 Chrome 中收到以下错误（同事在他们的机器上也收到同样的错误）：

我尝试使用以下方法构建我的 Angular 应用程序：

ng build --prod
ng build --prod --base-href sep6-app

Angular 应用文件夹结构：

- dist/
  - sep6-app/
  - app.yaml

我的 app.yaml：

runtime: python27
api_version: 1
threadsafe: true

handlers:

- url: /.*
  static_files: sep6-app/index.html
  upload: sep6-app/index.html

- url: /.*
  static_dir: sep6-app

在 GCP 中，我的存储桶包含：

- app.yaml
- sep6-app/

有一件事，如果我像这样在 app.yaml 中设置 URL，然后重新部署：

- url: /
  static_files: sep6-app/index.html
  upload: sep6-app/index.html

- url: /
  static_dir: sep6-app

我可以毫无问题地访问我的应用程序，但是如果我刷新任何页面，我会收到 404 错误，我理解这是由于 Angular 处理路由的方式而导致的。但是我不明白为什么“- url：/。*”在短时间内工作然后停止？

我正在使用（如果需要）：

Angular CLI: 9.1.7
Angular: 9.1.9

关于为什么会发生这种情况以及如何解决此问题的任何想法或想法？谢谢！

【参考方案1】：

通过使用以下 app.yaml 设法使其正常工作：

runtime: python38
service: default

handlers:
- url: /(.*\.(gif|png|jpg|less|json|woff|woff2|ttf|eot|scss|css|js|ico|svg)(|\.map))$
  static_files: sep6-app/\1
  upload: sep6-app/(.*)(|\.map)
- url: /(.*)
  static_files: sep6-app/index.html
  upload: sep6-app/index.html

【讨论】：

@MaríaCristinaFernándezLópez 是的，您仍然面临问题吗？