如何在后端Bucket的Https负载均衡器上进行URL重写？

Question

我正在通过 Cloud CDN 提供部署在 Google Cloud Storage 存储桶上的 React 应用程序。所以基本上是全局 HTTPS 负载均衡器后面的后端存储桶。我最初遇到的问题是，React 使用/控制浏览器导航专用的虚拟路径，并不代表 Cloud Storage 存储桶上的实际路径，如果用户直接访问 https://example，这会导致 404。例如，com/account。我通过使用

gsutil web set -m index.html -e index.html gs://

解决了这个问题，它将为我的 index.haml (react) 作为 404 页面。

应用程序现在工作正常，但现在的问题是 SEO，因为机器人收到 404。提供 index.html 是一种仅适用于浏览器的解决方案。

在使用 Cloud CDN 和 HTTPs Loadbalancer 之前，我使用 Nginx 容器提供静态文件，这使我可以使用重写来处理问题。我有以下 Nginx 声明：

location ~* ^.+\.(?:css|cur|js|jpe?g|gif|htc|ico|png|xml|otf|ttf|eot|woff|woff2|svg)$ {
  root   /usr/share/nginx/html;
  add_header Cache-Control 'max-age=0';
}

我可能不是第一个使用 Google Cloud CDN 托管 SPA 应用程序的人，所以我想知道我是否错过了什么。我尝试在 HTTPS 负载均衡器上创建重写规则，但似乎没有任何效果。这是我尝试过的路由规则：

defaultService: projects/example-project/global/backendBuckets/webapp-dev
name: matcher-test
routeRules:
- description: index-rewrite
  matchRules:
  - prefixMatch: /
  priority: 1
  service: projects/example-project/global/backendBuckets/webapp-dev
  routeAction:
    urlRewrite:
      pathPrefixRewrite: /index.html

简而言之，我需要将所有 404 结果重写为状态码为 200 的 index.html。

Answer 1

您好，与您分享带有后端存储桶的外部应用程序负载均衡器配置，其中目标是 URL 重写。请重点关注后端和路由规则的配置。

在此示例中，我将使用以下 2 个资源：

http://IP_ADDRESS/never-fetch/ Three-cats.jpg

http://IP_ADDRESS/love-to-fetch/two-dogs.jpg

其中“/never-fetch/two-dogs.jpg”存储在/cats（默认服务）中，“/love-to-fetch/two-dogs.jpg”存储在/dogs中。

在负载均衡器的后端配置下，您需要关注“主机和路径规则”。对于主机字段，输入

\*

表示资源“dog”，并在路径字段中输入 /love-to-fetch/*。

您可以使用此命令“gcloudcomputeurl-mapsdescribehttp-lb”来查看 url 映射，它应该如下所示：

creationTimestamp: '2020-10-13T11:18:10.561-07:00'
defaultService: https://www.googleapis.com/compute/v1/projects/PROJECT_ID/global/backendBuckets/cats
fingerprint: MKfYsObzqgw=
hostRules:
- hosts:
  - '*'
  pathMatcher: path-matcher-1
id: '1420501688756228493'
kind: compute#urlMap
name: test-bucket
pathMatchers:
- defaultService: https://www.googleapis.com/compute/v1/projects/PROJECT_ID/global/backendBuckets/cats
  name: path-matcher-1
  pathRules:
  - paths:
    - /love-to-fetch/*
    service: https://www.googleapis.com/compute/v1/projects/PROJECT_ID/global/backendBuckets/dogs
selfLink: https://www.googleapis.com/compute/v1/projects/PROJECT_ID/global/urlMaps/http-lb

在此示例中，要重写“/love-to-fetch/”URL 以到达“two-dogs.jpg”，您可以按照此链接，其中重点是编辑要重写的主机和路径规则。以下是链接中步骤的屏幕截图。

有关重写的信息的完整详细信息可以在此 link 上找到，有关使用后端存储桶创建负载均衡器的信息可以在此 link

上找到