混合内容
Baseline 广泛可用 *
当一个网页通过安全通道(例如 HTTPS)从安全源加载时,与 Web 服务器的连接会被加密,因此可以防止窃听和中间人攻击的篡改。如果安全加载的网页只包含同样托管在安全源上的图片、脚本和其他资源,用户可以确信整个页面都是安全的,不会受到这类攻击。
“混合内容”是指通过 HTTP 或其他不安全协议获取资源的、已安全加载的网页。这种网页可能不安全,因为任何通过不安全方式发送的资源都可能被攻击者查看,从而可能泄露敏感信息,和/或被篡改。脚本尤其危险,因为它们可以修改网页的任何方面,但所有类型的资源都存在一定风险。例如,图片可能被修改以向用户提供错误或误导性信息,或者更改按钮的显示功能。
“混合下载”是指从安全上下文中启动,但通过不安全连接获取的资源下载。这些下载面临与混合内容相同的风险:下载内容看起来来自安全源,但可能在传输过程中被篡改或被查看。
你应该避免在你的网站中使用混合内容和混合下载!浏览器会通过自动将图片、视频和音频的混合内容请求从 HTTP 升级到 HTTPS 来减轻混合内容的风险,并阻止所有其他资源类型的 But would not allow insecure requests. They should also block mixed downloads by default.
混合内容类型
网页中的混合内容分为两类:“可升级内容”和“可阻止内容”。浏览器应该自动将可升级内容的请求从 HTTP 升级到 HTTPS,并阻止可阻止内容的请求。
这种方法可以确保安全上下文中的所有内容要么通过安全通道加载,要么被阻止,这比显示混合安全和不安全内容对用户来说更安全,并且比通过完全阻止不安全内容来破坏网页更具干扰性。
注意: 规范的早期版本将混合内容分为“可阻止”和“可选可阻止”类别。
- 可阻止的内容类型,也称为“活动混合内容”,是指可能修改网页其他部分的内容,例如脚本和样式表。如果这些文件被修改,潜在风险非常高,浏览器必须阻止它们。
- 可选可阻止的内容类型,也称为“被动混合内容”,是指不能修改网页中其他内容的文件,例如图片、视频和音频文件。允许这些文件存在的潜在风险较低,因此浏览器可以选择阻止或显示它们,或者将决定权交给用户。
构成“可升级内容”的资源类型集合源自“可选可阻止”的混合内容集合。预期是任何新的文件类型都将被定义为可阻止内容,并且一些可升级内容在未来可能会变得可阻止。
可升级内容
可升级内容请求是指那些将不安全请求自动升级为安全请求的请求,通过将源方案从 `http` 更改为 `https`。远程服务器将响应资源,或者返回一个指示未找到的响应码。
此类别中的资源类型是指那些如果阻止请求可能会破坏 Web 的大部分内容。这些目前对应于以前“可选可阻止”的混合内容类型,因为它们仍在某些网站上使用。
以下元素是可升级的(除非 URL 主机被指定为 IP 地址 — 请参阅下面的部分)
可阻止内容
可阻止内容定义为“所有不可升级的混合内容”。
这包括以下元素引起的 HTTP 请求(此列表并不详尽)
<script>,其源通过 `src` 属性设置。<link>,其源在 `href` 属性中设置,并且包含样式表。<iframe>,其源通过 `src` 属性设置。fetch()请求。XMLHttpRequest请求。- CSS 中使用 `
` 值的所有情况(`@font-face`、`cursor`、`background-image` 等)。 <object>(`data` 属性)。Navigator.sendBeacon(`url` 属性)。<img>,其源通过 `srcset` 或 `` 设置。 - Web 字体
如果 URL 的主机是 IP 地址而不是域名,那么原本会被升级的混合内容请求将被阻止。因此,`<img src="http://example.com/image.png">` 会被升级,但 `<img src="http://93.184.215.14/image.png">` 会被阻止。
混合内容请求示例
混合内容请求是来自 安全上下文的不安全资源请求。
以下示例演示了安全、不安全和混合内容请求。
- `http://insecure.com` 加载 `http://also.insecure.com` — 这不是混合内容请求,因为两个源都不安全。
- `https://secure.com` 加载 `http://insecure.com` — 这是一个混合内容请求,因为不安全资源 `http://insecure.com` 被加载到安全上下文 `https://secure.com` 中。
- `http://insecure.com` 在 `<iframe>` 中加载 `https://secure.com`,而 `https://secure.com` 又加载 `http://also.insecure.com` — 将 `https://secure.com` 加载到 `http://insecure.com` 中不是混合内容请求(将安全上下文加载到不安全上下文中没有限制)。但是将 `http://also.insecure.com` 加载到安全框架 `https://secure.com` 中是一个混合内容请求。
- `https://secure.com` 框架加载了一个 `data:` URL,该 URL 加载了 `http://insecure.com` — 这是一个混合内容请求,因为 `https://secure.com`(以及因此的 `data:`)是安全加载的,而 `http://insecure.com` 是不安全的。
混合上下文请求也可以来自插件或工作线程等安全上下文,并且将以相同的方式被升级/阻止。
但请注意,从安全上下文导航到不安全的目标顶级浏览上下文的导航请求不被视为混合内容,因为它们会创建一个独立于请求源的新上下文,该上下文要么是安全的,要么是不安全的。
加载本地提供的混合资源
本地资源被视为来自安全源,就像 HTTPS 源一样。这包括 `file:` URL,以及从环回地址(如 `http://127.0.0.1/` 或 `https:///`)访问的内容。
你可以从安全上下文加载这些文件,你仍然会拥有一个安全上下文。但是,如果本地文件通过 `http:` 加载了不安全资源,那将是一个混合内容请求。
加载本地内容的支持情况可以在 浏览器兼容性 部分查看。
混合下载
混合下载是指从安全上下文通过不安全连接下载资源。它们之所以有问题,原因与混合内容相同——内容可能被攻击者拦截和/或篡改,并且用户不清楚这可能会在一个安全网站上发生。
例如,以下代码定义了一个 <a> 元素,该元素可用于下载 `http://example.com/` 这个不安全源的页面。如果这段代码在一个通过 HTTPS 提供的页面中,保存此链接将导致混合下载。
<a href="http://example.com/" download>Download</a>
预计浏览器会阻止混合下载,并且安全网站不应包含它们。
注意: 浏览器通常默认阻止混合下载,但会告知用户风险并允许他们保留或放弃下载。
开发者控制台
开发者控制台在混合内容被升级或阻止时显示警告。这些警告可用于调试和修复网站中的混合内容问题。
下面的截图显示了 Firefox 中一张图片被升级时的控制台警告(Chrome 也有类似的警告)。

在仍然显示“可选可阻止”内容的浏览器版本中,会使用一个图标来指示显示的內容中存在混合内容,并伴有控制台警告。下面的截图显示了 Firefox 开始支持可升级混合内容时的图标和控制台警告。

修复混合内容问题
避免混合内容问题的最佳策略是全部以 HTTPS 的方式提供内容。
-
将您域中的所有内容都以 HTTPS 的方式提供。
-
将所有指向您域中资源的引用转换为相对链接或 HTTPS 链接,包括下载链接。
-
如果使用其他网站的资源,请使用其 HTTPS 版本(如果可用)。
大多数网站都提供共享资源的 HTTPS 版本。通常最简单的方法是将所有 `http://` 链接替换为 `https://`,然后使用 LinkChecker 等工具来验证所有链接是否都能正常工作。
有多种方法可以验证您的网站是否没有混合内容,包括:
- 浏览您的网站,并在浏览器的 开发者控制台 中查找混合内容警告。
- 在浏览器中禁用所有混合内容,并测试页面是否按预期工作。这是 Safari 的默认设置,但大多数浏览器都支持某种阻止所有混合内容的机制(请参阅 兼容性数据)。
- 使用桌面 Web 爬虫(如 HTTPSChecker)或 CLI 工具(如 mcdetect)来递归检查您的网站并查找不安全内容的链接。
- 使用在线工具(如 Mixed Content Checker)来检查您的网站。
规范
| 规范 |
|---|
| 混合内容 # 简介 |
浏览器兼容性
加载中…
另见
- CSP:`upgrade-insecure-requests` 会将所有请求升级到 HTTPS,包括可阻止的混合内容。