如何通过 https 修复 css 和 js 的“阻止加载混合活动内容”

Posted 2023-02-25

【中文标题】如何通过 https 修复 css 和 js 的“阻止加载混合活动内容”

【英文标题】：How to fix "Blocked loading mixed active content" for css and js over https

【发布时间】：2015-11-25 06:01:46

【问题描述】：

尝试通过 https 查看我的网站时，我的 Firefox 控制台中不断出现“阻止加载混合活动内容”错误。我仅在我的 css 和 js 文件中收到此错误。

之所以这么糊涂，是因为页面代码本身对文件的引用是https：

<link rel="stylesheet" href="https://www.example.com/style.css">

但在控制台中，它显示为 http:

阻止加载混合活动内容“http://www.example.com/style.css”[了解更多]

我可以在页面上查看源代码并搜索“http://”，页面上任何地方都没有结果。

有什么想法吗？

【问题讨论】：

也许您的服务器出于某种原因将 https 重定向到 http，即证书无效。您确定您的所有页面和资源都在 SSL 下吗？

如果你使用 Drupal，你可以看看this answer

【参考方案1】：

我认为您可以尝试使用相关协议调用者。

<link rel="stylesheet" href="//www.example.com/style.css">
                    ---------^^

如果您的用户以 http 方式访问您的网站，则加载 http，如果用户以 https 方式访问，则加载 https。

【讨论】：

所以没有 htaccess 解决方案？我从不在任何东西上使用绝对网址

我认为这与htaccess没有任何关系

RewriteCond %HTTP_HOST =blabla.com RewriteCond %HTTPS 关闭 RewriteRule .* https://%HTTP_HOST%REQUEST_URI [L,R=301]

这个变通办法的问题是有时我们需要使用第三方 css 并且不应该改变它。我得到了这些：Blocked loading mixed active content “http://jsfiddle.net/font/medium/BlackTie-Medium-webfont.woff2?v=1.0.0”、Blocked loading mixed active content “http://fonts.gstatic.com/s/inconsolata/v16/BjAYBlHtW3CJxDcjzrnZCI4P5ICox8Kq3LLUNMylGO4.woff2”、Blocked loading mixed active content “http://jsfiddle.net/font/solid/BlackTie-Solid-webfont.woff2?v=1.0.0”。实际上浏览器应该处理标题。

htaccess 无法提供解决方法，因为浏览器未加载混合内容意味着永远不会向服务器发送请求，因此服务器永远不会响应或处理 htaccess 重定向