跨双域访问静态文件时Access-Control-Allow-Origin不匹配问题求助

问题复现 #

应用可通过backoffice.*、backoffice-mfe.*两个域名访问，单一域名下运行正常，但跨域名跳转时触发CORS错误：

Access to fetch at 'https://storage.googleapis.com/import-map-deployer-staging/manabie/syllabus/20230821081002.0c032eb4/syllabus-init-module/index.js' from origin 'https://backoffice.staging.manabie.io' has been blocked by CORS policy: The 'Access-Control-Allow-Origin' header has a value 'https://backoffice-mfe.staging.manabie.io' that is not equal to the supplied origin. Have the server send the header with a valid value, or, if an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

已尝试设置Access-Control-Allow-Origin: *、指定两个域名及Vary: Origin，问题仍未解决。

排查与解决方案 #

• 检查缓存层/CDN的Vary头支持
  即使设置了Vary: Origin，如果中间缓存层（比如Google Cloud Storage的默认缓存、第三方CDN）没有正确解析这个头，会直接返回之前缓存的响应（对应旧域名的Access-Control-Allow-Origin值）。可以：

  • 针对该资源设置Cache-Control: no-cache临时测试，排除缓存干扰；
  • 确认GCS的缓存配置中，已开启对Vary: Origin的识别，避免缓存不同Origin的响应。

• 验证GCS的CORS配置正确性
  确保GCS的CORS规则中，已同时包含两个域名的完整origin，且规则是动态匹配请求Origin返回对应值，而非固定死单一域名。示例配置（JSON格式）：

  [
    {
      "origin": ["https://backoffice.staging.manabie.io", "https://backoffice-mfe.staging.manabie.io"],
      "method": ["GET"],
      "responseHeader": ["Content-Type"],
      "maxAgeSeconds": 3600
    }
  ]
  

  注意：如果请求携带凭证（如Cookie、HTTP认证），需额外添加"responseHeader": ["Access-Control-Allow-Credentials"]并设置Access-Control-Allow-Credentials: true，且此时不能用*作为Origin值。

• 手动测试请求响应头
  用curl模拟不同Origin的请求，确认服务器返回的Access-Control-Allow-Origin是否匹配请求Origin：

  # 测试backoffice域名的请求
  curl -H "Origin: https://backoffice.staging.manabie.io" -I https://storage.googleapis.com/import-map-deployer-staging/manabie/syllabus/20230821081002.0c032eb4/syllabus-init-module/index.js
  
  # 测试backoffice-mfe域名的请求
  curl -H "Origin: https://backoffice-mfe.staging.manabie.io" -I https://storage.googleapis.com/import-map-deployer-staging/manabie/syllabus/20230821081002.0c032eb4/syllabus-init-module/index.js
  

  如果返回的Access-Control-Allow-Origin始终是同一个域名，说明GCS的CORS配置未生效，需要重新部署配置。

• 排查微前端资源加载逻辑
  跨域名跳转后，检查微前端的import-map或模块加载逻辑是否仍在复用旧域名下的请求上下文，导致发起请求时Origin未更新。可以尝试跳转后强制刷新页面，或在路由切换时重新加载import-map资源。

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