https 页面加载 http 资源会触发浏览器混合内容拦截，导致资源加载失败；必须将所有静态资源链接改为 https 或协议相对地址，nginx sub_filter 仅可临时替换 html 中的 http 链接，且需验证 network 中所有请求协议均为 https。
HTTPS 环境下页面加载 HTTP 静态资源会触发浏览器“混合内容”（Mixed Content）拦截，导致 CSS、JS、图片等资源无法加载，页面白屏或功能异常。这不是 Nginx 配置问题，而是浏览器强制安全策略——关键在于让所有资源请求走 HTTPS 协议。
确保静态资源链接自动升级为 HTTPS
前端 HTML、CSS、JS 中若写死 http:// 路径（如 <script src="http://cdn.example.com/app.js"></script>），即使 Nginx 已启用 HTTPS，浏览器仍会拒绝加载。必须从源头修复：
- 将硬编码的
http://改为协议相对地址：//cdn.example.com/app.js，这样在 HTTPS 页面中自动走 HTTPS - 或统一使用绝对 HTTPS 地址：
https://cdn.example.com/app.js - 若使用构建工具（Webpack/Vite），检查
publicPath或base配置是否设为"/"或"https://your-domain.com/"，避免生成 http 前缀
通过 Nginx 重写 HTTP 资源请求（临时兜底）
当无法修改前端代码时，可在 Nginx 的 HTTPS server 块中用 sub_filter 替换响应体中的 HTTP 链接（仅适用于 HTML 响应）：
- 启用
sub_filter模块（需编译时含--with-http_sub_module） - 在 location 块中添加：
sub_filter 'http://your-domain.com/' 'https://your-domain.com/';
sub_filter_once off;
sub_filter_types text/html application/xhtml+xml; - 注意：该方式不处理 JS/CSS 内部的 HTTP 链接，也不适用于外部 CDN 资源，仅作应急
验证静态资源是否真正走 HTTPS
部署后务必检查浏览器开发者工具的 Network 标签页：
- 所有静态资源（.css、.js、.png 等）的 Protocol 列应显示 h2 或 https
- Status 列不应出现 blocked:mixed-content
- 点击资源查看 Headers → Request URL，确认开头是
https:// - 若仍有 HTTP 请求，说明路径未修正或缓存未清除（可尝试无痕窗口访问）
避免常见配置陷阱
以下操作看似合理，实则无效甚至有害：
- 在 Nginx 中监听 80 端口并 proxy_pass 到 443 —— 这只是转发，资源仍以 HTTP 发起，浏览器照样拦截
- 用 rewrite 把
http://请求 301 跳转到https://—— 页面已发起 HTTP 请求，跳转发生在客户端收到响应后，此时资源早已被拦截 - 以为只要 Nginx 配了 SSL，所有资源就自动 HTTPS —— SSL 是传输层加密，不影响资源 URL 本身的协议声明
