文章目录
问题描述:
Mixed Content: The page at 'https://' was loaded over HTTPS, but requested an insecure frame 'http://'. This request has been blocked; the content must be served over HTTPS.
原因分析:
什么是混合内容?
根据 Google 的说法,当网站上的 HTML 通过安全的 HTTPS 连接(由于最近安装的 SSL 证书)加载时会出现混合内容,但其他内容(例如图像、视频内容、样式表和脚本)继续通过不安全的 HTTP 加载联系。这会导致某些 Web 内容加载安全,而某些 Web 内容加载不安全。
因此得名“混合内容”。
混合或不安全内容的问题在于,无论内容本身是否安全,它们都通过安全的 HTTPS 连接加载。当这种情况发生时,现代浏览器(例如 Google Chrome)会向尝试查看网站包含不安全内容的 Web 内容的用户显示警告。
通过 HTTPS 连接加载的安全网站具有以下优势
验证。向您的网站访问者保证,当他们登陆您的网站并与您的网站内容互动时,他们是安全的,尤其是当您经营一家共享财务信息的在线商店时。此外,验证站点访问者是否在他们想要访问的网站上并且没有被重定向到恶意站点。
数据的完整性。直观地告诉网站访问者,无论他们在您的网站上采取什么行动,他们的个人和财务信息都是安全的,不会受到黑客攻击。此外,让浏览器能够检测黑客是否更改了浏览器接收的任何数据。换句话说,帮助用户相信黑客没有将通过您的在线商店支付的钱重定向到另一个帐户。
匿名。向网站访问者保证他们在您网站上的行为不会被其他人拦截和恶意使用。
https://www.thesslstore.com/blog/how-to-find-and-fix-mixed-content-warnings-on-https-sites/
解决方案:
防止 HTTPS 站点上出现混合内容警告的方法
尽管连接安全,但在您的网站上安装 SSL 证书并继续收到混合内容警告可能会令人沮丧。这就是为什么有时需要采取一些额外措施来保护您的网站并保护您的网站访问者的原因。
加载网页时始终使用 HTTPS URL
尽可能将 HTTPS 连接 (https://) 应用于网站上的所有网页,这一点很重要。如果您注意到您的网页正在通过不安全的连接加载,尽管您的网站上有一个活动的 SSL 证书,您需要解决这个问题。这可能意味着与您的网络托管服务提供商的支持团队取得联系,如果他们为您提供 SSL 证书。
使用 Content-Security-Policy-Report-Only 标头
如果您想自动收集网站上混合内容的报告,您可以考虑将此代码段添加到您网站的HTTP 响应标头中:
Content-Security-Policy-Report-Only: default-src https: 'unsafe-inline' 'unsafe-eval'; report-uri https://example.com/reportingEndpoint
尽管在混合内容成为问题之前修复它并不是 100% 可靠,但它确实可以帮助那些拥有大型网站的人掌握不安全的内容。
当站点访问者登陆包含混合内容的网页时,会向 https://example.com/reportingEndpoint
发送报告,提醒您某些内容违反了内容安全策略。
报告将包括:
相关网页的网址,以及违反策略的子资源。
通过配置报告端点以记录这些报告,您可以跟踪网站上的混合内容,而无需亲自访问每个网页。也就是说,此策略唯一有效的时间是网站访问者登陆包含混合内容的网页。更不用说,您只会收到中等至高流量网页的报告,这意味着混合内容可能会在您意识到之前加载一段时间。
使用 Upgrade-Insecure-Requests CSP 指令
在 HTTPS 站点上自动检测和修复混合内容警告成为问题之前的另一种方法是使用upgrade-insecure-requests指令工具。此工具会告诉浏览器在发出任何用户请求之前升级所有不安全的 URL。
换句话说,在为您网站前端的网站访问者加载之前,将确保不安全的 URL 是安全的。
为此,请将此元标记代码片段添加到文档的 HTML 部分:
<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">
请记住,如果通过 HTTPS 连接通过 HTTP 加载的资源在 HTTPS 上不可用,则此工具将不起作用。因此,资源不会升级为安全,也不会为站点访问者加载。虽然这意味着网站访问者会错过您网站的某些内容,但这也意味着他们在浏览您的网站时仍能保持安全。
通过Nginx 反向代理
server {
....
location /xxxx {
proxy_pass http://xxxxxx;
}
....
}