如何使用存储桶存储在 google flex/app 引擎环境中提供静态文件？

Question

我有一个 nodejs 后端和一个 reactjs 前端。我正在使用 gcloud flex 环境（应用程序引擎）并希望使用 CDN 提供所有前端文件。我不希望请求触及我的 nodejs 服务器。我无法配置我的项目 app.yaml 来做同样的事情。

我怀疑我的请求没有从 CDN 提供，因为如果我在我的 nodejs 代码中注释以下行，我将无法再访问 index.html。

app.use('/', express.static(path.resolve('./frontend/dist')));

下面是 YAML 文件。

handlers:
- url: /(.*\.html)
  mime_type: text/html 
  static_files: frontend/dist/\1 
  upload: frontend/dist/(.*\.html)

- url: /styles/(.*\.css) 
  mime_type: text/css 
  static_files: frontend/dist/styles/\1 
  upload: frontend/dist/styles/(.*\.css)

- url: /scripts/(.*\.js) 
  mime_type: text/javascript 
  static_files: frontend/dist/scripts/\1 
  upload: frontend/dist/scripts/(.*\.js)

- url: /images/(.*\.(bmp|gif|ico|jpeg|jpg|png)) 
  static_files: frontend/dist/images/\1 
  upload: frontend/dist/images/(.*\.(bmp|gif|ico|jpeg|jpg|png))

- url: / 
  static_files: frontend/dist/index.html 
  upload: frontend/dist/index.html

-  url: /.* 
  script: IGNORED
  secure: always

有没有办法配置应用引擎，使静态文件请求不响应我的 nodejs 后端服务器？

谢谢

Answer 1

您将standard GAE env app.yaml elements（静态内容配置）混入您的flex env app app.yaml。

在 flex 环境中提供静态内容是不同的。

您的基于express.static 的静态文件服务方法实际上对应于Serving from your application：

从您的应用程序提供服务

大多数 Web 框架都支持提供静态文件。在这 示例，应用程序使用express.static 中间件 将文件从./public 目录提供到/static URL。

要在请求不影响您的应用的情况下提供静态内容，您需要关注Serving from Cloud Storage：

从 Cloud Storage 存储分区提供静态文件的示例

这个简单的示例创建一个 Cloud Storage 存储分区并上传静态 使用 Cloud SDK 的资产：

1. 创建一个存储桶。以项目 ID 命名存储桶很常见，但不是必需的。存储桶名称必须是全局唯一的。

   gsutil mb gs://<your-bucket-name>
   

2. 设置 ACL 以授予对存储桶中项目的读取权限。

   gsutil defacl set public-read gs://<your-bucket-name>
   

3. 将项目上传到存储桶。 rsync 命令通常是上传和更新资产的最快和最简单的方法。你也可以 使用cp。

   gsutil -m rsync -r ./static gs://<your-bucket-name>/static
   

您现在可以通过以下方式访问您的静态资产 https://storage.googleapis.com/<your-bucket-name>/static/....

如需详细了解如何使用 Cloud Storage 服务静态资产， 包括如何通过自定义域名进行服务，参考How to Host a Static Website。

有关如何使用 Cloud Storage API 的更多信息 从您的内部动态上传、下载和操作文件 申请，见Using Cloud Storage。