此页面由 Cloud Translation API 翻译。

修正混合内容

Jo-el van Bergen

Rachel Andrew

让您的网站支持 HTTPS 是保护您的网站和用户免受攻击、但混合内容会使这项保护措施变得毫无用处。浏览器会屏蔽越来越不安全的混合内容，如什么是混合内容？中所述。

在本指南中，我们将介绍解决现有混合内容问题的技术和工具并防止出现新问题

通过访问您的网站查找混合内容

在 Google Chrome 中访问 HTTPS 网页时，浏览器会在 JavaScript 控制台中以错误和警告的形式提醒您存在混合内容。

在什么是混合内容？部分，您可以找到许多示例，并了解 Chrome 开发者工具中的问题报告方式。

被动混合内容示例将显示以下警告。如果浏览器能够在 https 网址中找到相关内容，它会自动升级该内容，然后显示一条消息。

主动混合内容会被屏蔽，并显示警告。

如果您在自己的网站中发现针对http://网址的此类警告，您需要在网站的源代码中修正它们。列出这些网址及其所在页面有助于您修正相应问题。

查找网站中的混合内容

您可以直接在源代码中搜索混合内容。在源代码中搜索 http://，并查找包含 HTTP 网址属性的标记。请注意，锚标记 (<a>) 的 href 属性中包含 http:// 这通常不是混合内容问题，但后面会讨论一些值得注意的例外情况。

如果您的网站是使用内容管理系统发布的，在发布网页时，系统可能会插入指向不安全网址的链接。例如，图片中可能包含完整网址，而不是相对路径。您需要在 CMS 内容中查找和修正这些内容。

修正混合内容

在网站来源中发现混合内容后您可以按照以下步骤进行修正

如果您收到一条控制台消息，提示您资源请求已从 HTTP 自动升级为 HTTPS，您可以安全地将代码中资源的 http:// 网址更改为 https://。您还可以通过在浏览器网址栏中将 http:// 更改为 https:// 来检查资源是否可用。并尝试在浏览器标签页中打开该网址。

如果资源无法通过 https:// 获取，您应考虑采用下列方案之一：

添加其他主机的资源（如果有）。
如果法律允许，请直接在您的网站上下载和托管内容。
将资源从您的网站中完全排除。

问题解决后查看您最初发现错误的页面，并验证该错误是否不再出现。

注意非标准标记的使用

请注意您网站上的非标准代码使用。例如，锚 (<a>) 代码网址不会导致混合内容错误，因为它们会导致浏览器转到新页面这意味着它们通常不需要修正。不过，有些图库脚本会替换 <a> 的功能标记，并将 href 属性指定的 HTTP 资源加载到网页上的灯箱显示内容中，造成混合内容问题。

大规模处理混合内容

上述手动步骤非常适合小型网站：但对于大型网站或拥有许多独立开发团队的网站跟踪加载的所有内容可能比较困难。为帮助完成此任务，您可以使用内容安全政策指示浏览器针对混合内容通知您，并确保您的网页绝不会意外加载不安全的资源。

内容安全政策

内容安全政策 (CSP) 是一种多用途浏览器功能，可用于管理大规模的混合内容。 CSP 报告机制可用于跟踪网站上的混合内容、并提供强制执行政策，通过升级或屏蔽混合内容来保护用户。

您可以通过添加 Content-Security-Policy 或 Content-Security-Policy-Report-Only 标头。此外，您还可以设置 Content-Security-Policy 在网页的 <head> 部分中使用 <meta> 标记（但不是 Content-Security-Policy-Report-Only）。

注意：现代浏览器会强制执行其收到的所有内容安全政策。浏览器在响应标头或 <meta> 元素中收到的多个 CSP 标头值会合并并强制执行为单个政策；报告政策也会以类似方式合并通过采用政策的交集来合并政策；也就是说，第一项政策之后的每项政策都只能进一步限制允许的内容，而不是扩大允许的内容。

使用内容安全政策查找混合内容

您可以使用内容安全政策收集有关您网站上混合内容的报告。要启用此功能，请设置 Content-Security-Policy-Report-Only 指令，方法是将其添加为您网站的响应标头。

响应标头：

Content-Security-Policy-Report-Only: default-src https: 'unsafe-inline' 'unsafe-eval'; report-uri https://example.com/reportingEndpoint

注意：report-uri 响应标头将弃用，取而代之的是 report-to。

浏览器支持

<ph type="x-smartling-placeholder">
<ph type="x-smartling-placeholder">
<ph type="x-smartling-placeholder">

来源

您可以同时提供这两个标头，在这种情况下，如果浏览器支持 report-to，report-uri 将被忽略。

每当用户访问您网站上的网页时他们的浏览器会就任何违反内容安全政策的内容向 https://example.com/reportingEndpoint。在这种情况下，每当通过 HTTP 加载子资源时，系统都会发送报告。这些报告包括出现违规问题的网页网址以及违反政策的子资源网址。如果您将报告端点配置为记录这些报告，您可以跟踪网站上的混合内容，而无需自己访问每个网页。

对此有两点需要注意：

用户必须在可识别 CSP 标头的浏览器中访问您的页面。这对于大多数现代浏览器都是如此。
您只会获得用户访问的网页的报告。因此，如果您的某些网页的流量不太高您可能需要等待一段时间才能获得整个网站的报告。

内容安全政策指南中提供了更多信息，还提供了一个示例端点。

CSP 报告的替代方案

如果您的网站是由 Blogger 等平台托管，您可能无权修改标头和添加 CSP。相反，一种可行的替代方案是使用网站抓取工具为您找出网站中的问题，例如 HTTPSChecker 或混合内容扫描。

升级不安全的请求

浏览器支持

<ph type="x-smartling-placeholder">
<ph type="x-smartling-placeholder">
<ph type="x-smartling-placeholder">
<ph type="x-smartling-placeholder">

来源

浏览器开始升级并阻止不安全的请求。您可以使用 CSP 指令强制自动升级或屏蔽这些资产。

upgrade-insecure-requests CSP 指令指示浏览器先升级不安全的网址，然后再发出网络请求。

例如，如果网页包含带有 HTTP 网址（如 <img src="http://example.com/image.jpg">

浏览器会改为针对 https://example.com/image.jpg，以免用户出现混合内容。

您可以通过发送包含此指令的 Content-Security-Policy 标头来启用此行为：

Content-Security-Policy: upgrade-insecure-requests

或者，通过内嵌方式将同一指令嵌入到文档的 <head> 中部分：<meta>

<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">

与浏览器自动升级一样，如果资源无法通过 HTTPS 获得升级后的请求失败，且未加载资源。这样做可以保证您网页的安全。upgrade-insecure-requests 指令的适用范围大于浏览器自动升级，升级请求。

upgrade-insecure-requests 指令级联到 <iframe> 文档中，确保整个网页都受到保护