chrome直接丢弃http css请求，因属主动混合内容，浏览器在发起前就拦截；需用devtools network面板筛选mixed定位，并将所有http://显式替换为https://。
必须把所有 http:// 显式替换成 https://，不能用 // 协议相对 URL，也不能依赖 CSP 自动升级。
为什么浏览器连请求都不发就报 blocked:mixed-content
<link rel="stylesheet"> 属于主动型混合内容，浏览器在 TCP 连接建立前就直接丢弃 HTTP 请求。你不会看到 404 或超时，Network 面板里 Status 列清清楚楚写着 blocked:mixed-content。这不是加载失败，是策略性拦截——因为 CSS 能篡改渲染树、影响 getComputedStyle()、触发 FOUC，甚至劫持后续资源。
常见被拦位置包括：
<link href="http://fonts.googleapis.com/css?...">- CSS 文件内部的
@import url("http://...") - 后端模板拼接的链接，如
echo '<link href="http://'%20.%20%24host%20.%20'/css/app.css>'%0A - JS%20%E5%8A%A8%E6%80%81%E5%88%9B%E5%BB%BA%E7%9A%84%20
link%20%E5%85%83%E7%B4%A0%EF%BC%9Ael.href%20=%20'http://cdn.example.com/style.css'%0A
%E6%80%8E%E4%B9%88%E5%BF%AB%E9%80%9F%E5%AE%9A%E4%BD%8D%E6%89%80%E6%9C%89%E8%A2%AB%E6%8B%A6%E7%9A%84%20HTTP%20CSS
%0A%E5%88%AB%E9%9D%A0%E8%82%89%E7%9C%BC%E6%89%AB%20HTML%E3%80%82%E6%89%93%E5%BC%80%20Chrome%20DevTools%20%E2%86%92%20Network%20%E6%A0%87%E7%AD%BE%E9%A1%B5%20%E2%86%92%20%E5%88%B7%E6%96%B0%E9%A1%B5%E9%9D%A2%20%E2%86%92%20%E5%9C%A8%20Filter%20%E8%BE%93%E5%85%A5%E6%A1%86%E8%BE%93%E5%85%A5%20mixed%EF%BC%8C%E6%89%80%E6%9C%89%E8%A2%AB%E6%8B%A6%E8%AF%B7%E6%B1%82%E7%AB%8B%E5%88%BB%E9%AB%98%E4%BA%AE%E3%80%82%E7%82%B9%E5%87%BB%E4%BB%BB%E4%B8%80%E9%A1%B9%EF%BC%8C%E7%9C%8B%20Initiator%20%E5%88%97%EF%BC%8C%E5%B0%B1%E8%83%BD%E5%8F%8D%E6%9F%A5%E5%88%B0%E6%98%AF%E5%93%AA%E8%A1%8C%20<link>%20%E6%88%96%20JS%20%E6%8F%92%E5%85%A5%E5%AF%BC%E8%87%B4%E7%9A%84%E3%80%82
%E6%9B%B4%E5%87%86%E7%9A%84%E5%81%9A%E6%B3%95%E6%98%AF%E5%85%A8%E5%B1%80%E6%90%9C%E7%B4%A2%EF%BC%9A
%0A- %0A
- %E6%8C%89%20
Ctrl+Shift+F%EF%BC%88Windows/Linux%EF%BC%89%E6%88%96%20Cmd+Option+F%EF%BC%88macOS%EF%BC%89%E6%90%9C%20http://%0A - %E9%87%8D%E7%82%B9%E6%A3%80%E6%9F%A5%EF%BC%9A
<link%20rel=" stylesheet>、CSS 文件里的@import和url("http://")、JS 中动态设置的href - 本地开发用
https://localhost:3000加载页面，却引用线上http://xxx.com/style.css，同样触发拦截
为什么 //cdn.example.com/style.css 不安全
协议相对 URL 看似省事，但风险陡增：
- 很多老旧内网静态服务、测试 CDN、第三方字体服务（如某些自建 font server）根本不提供 HTTPS 端点，一用就
404 -
//对 query 参数敏感，比如//cdn.example.com/style.css?v=1.2.3，若目标服务 HTTPS 证书异常或不支持该参数，照样失败 - 某些代理或企业防火墙会拦截
//请求并降级为 HTTP，导致静默失败 - 它无法提前暴露问题，而显式写
https://可在第一时间发现证书异常或重定向问题
CSS 内部的 @import 和 url() 容易被忽略
这些引用不会出现在 HTML 里，却一样触发 blocked:mixed-content，且在 Network 面板中显示为子请求。必须进 CSS 文件逐行检查：
- 查找所有
@import url("http://、@import "http:// - 查找所有
url("http://、background: url("http://、src: url("http:// - 字体声明如
@font-face { src: url("http://...") }同样要改
真正难处理的是那些由构建工具注入、或从 CMS 导出的 CSS——它们可能藏在打包产物里，得结合 sourcemap 或原始源文件一起查。最稳妥的做法不是“找完再改”，而是把 CI 流程加上 grep -r "http://" src/ | grep -i "\.css\|\.html" 类似的检查步骤，避免漏掉。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
