HTTPS页面加载静态资源报CORS，本质是混合内容或响应头缺失引发浏览器双重拦截；需同步排查协议一致性、响应头完整性及预检请求处理。
HTTPS页面加载静态资源报CORS，本质不是HTTPS本身的问题，而是混合内容（Mixed Content）或响应头缺失触发了浏览器双重拦截——既拦非HTTPS资源，又拦跨域响应头。排查要从协议一致性、响应头完整性、预检请求处理三方面同步推进。
检查静态资源URL是否强制走HTTPS
浏览器对HTTPS页面中加载的HTTP资源会直接阻断（主动型混合内容），此时控制台报错是“Mixed Content: The page at 'https://...' was loaded over HTTPS, but requested an insecure resource 'http://...'”，而非CORS错误。但新手常误判为跨域问题。
- 打开浏览器开发者工具 → Network 标签页 → 刷新页面 → 找到报错的JS/CSS/图片请求 → 查看其 Protocol 列是否为 http
- 所有静态资源链接必须使用相对协议（
//cdn.example.com/js/app.js）或显式 HTTPS（https://cdn.example.com/js/app.js） - Nginx配置中若用
proxy_pass http://backend代理静态文件，需确认后端服务本身是否支持HTTPS，否则应改用https://backend或统一由Nginx提供静态服务
确认Nginx返回的静态资源响应头含完整CORS字段
即使资源走HTTPS，若Nginx未给静态文件响应添加Access-Control-Allow-Origin等头，浏览器仍按CORS规则拦截（尤其当资源被JS动态加载时，如fetch('/assets/config.json')）。
- 在Network中点击报CORS的静态资源 → 查看Response Headers → 确认是否存在：
Access-Control-Allow-Origin: https://your-frontend-domain.com（生产环境禁止用*，尤其涉及凭证时） - 若缺失，在对应
location块中补全（例如托管在/static/下的资源）：location /static/ {<br> alias /www/static/;<br> add_header 'Access-Control-Allow-Origin' 'https://your-frontend-domain.com';<br> add_header 'Access-Control-Allow-Methods' 'GET';<br> add_header 'Access-Control-Allow-Headers' 'DNT,User-Agent,X-Requested-With';<br> add_header 'Access-Control-Expose-Headers' 'Content-Length,Content-Range';<br>} - 注意：
add_header在Nginx中不继承，必须写在具体location内，不能只放在server顶层
验证OPTIONS预检是否被正确响应（针对带自定义头的静态资源请求）
某些前端框架（如Axios）或自定义fetch请求若携带Authorization、X-Request-ID等头，即使请求静态JSON，也会触发预检。而Nginx默认不处理OPTIONS方法，导致预检失败，浏览器直接报CORS。
- 在Network中筛选
OPTIONS请求 → 查看其状态码是否为204或200，响应头是否含Access-Control-Allow-Origin - 在静态资源的
location块中加入预检处理逻辑：if ($request_method = 'OPTIONS') {<br> add_header 'Access-Control-Allow-Origin' 'https://your-frontend-domain.com';<br> add_header 'Access-Control-Allow-Methods' 'GET';<br> add_header 'Access-Control-Allow-Headers' 'DNT,User-Agent,X-Requested-With';<br> add_header 'Access-Control-Max-Age' 86400;<br> add_header 'Content-Length' 0;<br> return 204;<br>} - 避免在
if中使用add_header以外的指令（如proxy_pass），Nginx官方明确不推荐
排除浏览器安全策略干扰（非CORS但表现相似）
Chrome/Edge近期加强了对私有网络（192.168.x.x、10.x.x.x）和localhost的访问限制。若静态资源托管在内网地址（如https://192.168.1.100/assets/），即使HTTPS+头齐全，也可能被拦截并显示类CORS错误。
- 检查资源URL是否为局域网IP或
localhost→ 若是，改用域名（如https://static-dev.example.com）并配好DNS或hosts - 临时在Chrome地址栏输入
chrome://flags/#block-insecure-private-network-requests→ 禁用该实验性功能验证是否为此原因 - 确保SSL证书有效且域名匹配，无效证书会导致整个HTTPS连接失败，后续资源加载根本不会发起
