aws部署站点时axios发https请求转http及残留localhost地址排查

• 定位残留的http://localhost:4000地址来源
  打开浏览器开发者工具的源代码全局搜索功能，检索localhost:4000，锁定具体是哪个静态JS文件携带了旧的本地接口地址。这类残留通常来自两个场景：
  • 前端生产构建时没有正确读取生产环境配置，把开发环境硬编码的本地接口地址直接打进了最终部署的静态包
  • 浏览器缓存了历史版本的旧静态资源，没有加载最新替换了正式域名的文件，清掉缓存重测就能验证是否是缓存问题
• 检查Axios全局配置的覆盖逻辑
  翻查项目入口文件、axios封装模块的代码，确认是否存在全局硬编码的默认配置。不少项目会在全局设置axios.defaults.baseURL，如果这里残留了旧的http地址或是localhost地址，优先级会高于你在单个请求里手动指定的https地址，最终发起的请求就会指向错误的目标。
• 校验CloudFront的转发配置
  逐项核对CloudFront的缓存行为规则：
  • 回源协议策略必须设置为“匹配查看器协议”，不能选强制回源HTTP的选项，避免服务端转发时触发协议降级
  • 确认没有配置自定义的响应改写规则，把返回页面里的https链接强制替换为http
    同时检查S3存储桶的静态网站托管配置，关闭不必要的http强制跳转逻辑，避免资源加载时被重定向到非加密协议。
• 确认浏览器混合内容拦截逻辑
  你看到的“请求从https被转成http”的报错，本质是浏览器的安全拦截机制：只要是在https加密页面里发起http协议的请求，浏览器就会直接阻断请求并抛出协议不匹配的报错，并不是Axios本身主动修改了请求的协议，根源还是页面加载的脚本里存在硬编码的http类请求地址。

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