如何在Google Cloud Platform存储桶托管站点移除URL的.html后缀？

嘿，我太懂你这种头疼了——GCP存储桶托管静态站的时候，.htaccess完全不管用，毕竟它根本不是Apache那套服务器架构嘛。别着急，我给你几个靠谱的解决方案，一步步来就能搞定去掉URL末尾.html后缀的需求：

这个方法不用写代码，靠存储桶的静态网站配置就能实现，分两步走：

• 第一步：重命名文件并设置正确的内容类型
  把你所有带.html后缀的文件重命名，去掉后缀（比如about.html改成about）。因为存储桶会根据文件名后缀自动识别文件类型，现在没了.html后缀，得手动指定Content-Type，不然浏览器会把它当成下载文件：

  1. 打开GCP控制台的存储桶页面，找到重命名后的文件
  2. 点击文件右侧的「编辑元数据」
  3. 添加一条元数据：键为Content-Type，值设为text/html
  4. 保存即可

• 第二步：设置重定向规则兼容旧链接
  如果之前带.html的URL已经被用户收藏或者收录到搜索引擎，得把这些请求重定向到新的无后缀URL，避免404：

  1. 在存储桶页面的「静态网站」设置里，滑到「高级设置」的「重定向规则」
  2. 粘贴以下规则（301是永久重定向，对SEO友好）：

  [
    {
      "source": "/**.html",
      "destination": "/**",
      "type": 301
    }
  ]
  

  3. 保存设置，这样所有带.html的请求都会自动跳转到去掉后缀的版本

如果你不想修改现有文件的命名，可以用Cloud Functions拦截请求，自动处理.html后缀的隐藏：

1. 创建一个Cloud Function，触发类型选择「HTTP」
2. 选择Node.js运行时，在函数代码里粘贴以下逻辑（记得替换成你的存储桶名称）：

const { Storage } = require('@google-cloud/storage');
const storage = new Storage();
const bucketName = '你的存储桶名称'; // 替换成实际的存储桶名

exports.resolveHtmlUrls = async (req, res) => {
  let requestPath = req.path;

  // 如果请求路径没有.html后缀，也不是目录，就尝试查找对应的.html文件
  if (!requestPath.endsWith('.html') && !requestPath.endsWith('/')) {
    const targetFilePath = `${requestPath}.html`;
    const targetFile = storage.bucket(bucketName).file(targetFilePath);
    const [fileExists] = await targetFile.exists();

    if (fileExists) {
      // 读取文件内容并以text/html类型返回
      const [fileContent] = await targetFile.download();
      res.set('Content-Type', 'text/html');
      res.send(fileContent);
      return;
    }
  }

  // 如果找不到对应文件，返回404
  res.status(404).send('Page Not Found');
};

3. 部署函数后，把你的自定义域名指向这个Cloud Function的URL，或者用Cloud Load Balancer将请求先转发到函数，再到存储桶

• 如果你用了自定义域名，要确保DNS记录正确指向对应的资源（存储桶静态网站URL或Cloud Function URL）
• 优先用方法一，因为它完全依赖存储桶原生能力，不需要额外的资源和成本
• 301重定向是永久重定向，一定要用这个类型，避免影响网站的SEO排名

内容的提问来源于stack exchange，提问作者Richard P.