Mixed Content 导致网站页面错乱?一次 ISC 项目的完整排查与修复
1、网站界面错乱,打开开发者工具 – 网络 – 全部。然后刷新网页,查看网络请求。发现样式文件的状态为:(已屏蔽:mixed-content)。如图1

2、但是,将状态为:(已屏蔽:mixed-content) 的 css 文件的网址在新标签页中打开,状态是 200。如图2

3、为什么会出现 (已屏蔽: mixed-content)
网站是:
👉 https://www.jammerfromchina.com
但页面里加载的 CSS 是:
👉 http://xxx.css(注意是 http)
浏览器安全策略是这样的:
HTTPS 页面
❌ 不允许加载 HTTP 资源(CSS / JS / 图片)
否则就会:
👉 直接拦截(blocked:mixed-content)
所以看到:
状态:(已屏蔽:mixed-content)
4、为什么“单独打开 CSS 是 200”?
这个也很好理解:
在新标签打开:
👉 http://xxx.css
这是一个独立 HTTP 请求
浏览器不会限制 → 返回 200 ✅
但:
❗ 在 HTTPS 页面里引用 HTTP 资源 → 被拦截
5、查看网页源代码,搜索:Styles/styles.css,发现引用网址为:http://www.jammerfromchina.com/templates/__master/Styles/styles.css 。
6、ISC(Interspire Shopping Cart)是一款老牌 PHP+MySQL 商业电商系统,2012 年已官方停更,核心定位是轻量、易用、快速建站,曾是 Magento、ZenCart 的有力竞品。编辑配置文件 /config/config.php,http: 替换为 https:
<?php <pre><code> $GLOBALS['ISC_CFG']["ShopPath"] = 'https://www.jammerfromchina.com';</code></pre>
7、刷新页面,界面已经正常。打开开发者工具 – 网络 – 全部。然后刷新网页,查看网络请求。发现样式文件的状态为:200。如图3

近期评论