使用S3搭建根域站点时如何配置URL重写与重定向规则？

以下分两种常见需求给出对应配置方法：

方案1：3xx重定向（浏览器地址栏会变为domain.com/test） #

该方案配置最简单，适合允许用户看到地址跳转的场景：

• 登录Cloudflare控制台，进入my.domain.com对应的域名管理页
• 找到规则 > 页面规则，点击创建页面规则
• 匹配URL填写：my.domain.com/test/*
• 添加操作选择「转发URL」，状态码可选301（永久重定向）或302（临时重定向）
• 目标URL填写：https://domain.com/test/$1，如果仅需要匹配/test单路径不需要通配符，直接填https://domain.com/test即可
• 保存并部署规则，等待生效即可

方案2：掩码转发/路径重写（浏览器地址栏保持my.domain.com/test不变） #

该方案适合需要保留二级域名地址的场景，使用Cloudflare Worker实现兼容性最好：

• 进入Cloudflare控制台，找到「Worker和Pages > 创建应用程序 > 创建Worker」
• 替换默认代码为以下代码：

addEventListener('fetch', event => {
  event.respondWith(handleRequest(event.request))
})

async function handleRequest(request) {
  const url = new URL(request.url)
  // 匹配/test开头的路径
  if (url.hostname === 'my.domain.com' && url.pathname.startsWith('/test')) {
    // 修改请求目标为根域
    const newUrl = new URL(url.pathname + url.search, 'https://domain.com')
    // 发请求到根域的资源，保留原始请求头和方法
    const response = await fetch(newUrl, {
      method: request.method,
      headers: request.headers,
      body: request.body
    })
    // 返回响应给用户，地址栏不变
    return new Response(response.body, {
      status: response.status,
      statusText: response.statusText,
      headers: response.headers
    })
  }
  // 其他路径正常走WordPress源站
  return fetch(request)
}

• 保存部署Worker后，回到my.domain.com的域名管理页，找到Worker路由
• 添加路由：my.domain.com/test/*，选择刚才创建的Worker，保存生效

注意事项 #

• 如果根域domain.com的S3桶配置了CORS，需要允许my.domain.com的跨域请求，否则静态资源加载可能会报错
• 若使用重定向方案，生效后可以清一下本地浏览器缓存再测试，避免301永久重定向的缓存影响测试结果
• 掩码转发场景下如果domain.com的资源有绝对路径跳转，可能会跳出my.domain.com的域名，需要自行调整S3站点的资源路径为相对路径

内容的提问来源于stack exchange，提问作者Raj