search

Marinerer / store

转载 && 收藏 && 乱七八糟 :clap:
65 stars 10 forks source link

HTTP协议 #53

Open Marinerer opened 8 months ago

Marinerer commented 8 months ago

大纲

Marinerer commented 8 months ago

.

Marinerer commented 8 months ago

.

Marinerer commented 8 months ago

HTTP安全之跨域策略

简介

Web 基于同源政策 (same-origin policy)构建，这是一项安全功能，用于限制文档和脚本与其他来源的资源交互方式。此原则会限制网站访问跨源资源的方式。例如，系统阻止 https://a.example 中的文档访问 https://b.example 上托管的数据。

但是，在历史上同源政策有一些例外。任何网站都可以：

为了修补这些安全副作用，引入了跨域资源共享 (CORS)协议和不透明资源的概念。CORS确保服务器允许与给定来源共享资源，而不透明资源则是隐式移除脚本对跨源资源的直接访问，同时保持向后兼容性。例如，这就是为什么除非对跨域图片应用 CORS，否则通过 CanvasRenderingContext2D 操控跨源图片的像素会失败。

一些关键术语：

为了确保访问强大的功能，如SharedArrayBuffer、Performance.measureMemory或JS Self-Profiling API，文档需要同时使用COEP（值为require-corp）和COOP（值为same-origin）。如果两者都不存在，浏览器将无法保证足够的隔离度以安全地启用这些功能。可以通过检查self.crossOriginIsolated是否返回true来确定页面的状况。

安全头参考

下面列出了可用于保护网站的最重要的安全头。

跨域共享

Cross-Origin Resource Sharing (CORS) 跨源资源共享是一种基于 HTTP 标头的机制，允许服务器指示除其自身之外的任何来源（域、协议或端口），浏览器应允许从中加载资源。 CORS 还依赖于一种机制，浏览器通过该机制向托管跨源资源的服务器发出“预检”请求，以检查服务器是否允许实际请求。在该预检中，浏览器发送指示 HTTP 方法的标头以及将在实际请求中使用的标头。

出于安全原因，浏览器限制从脚本发起的跨域 HTTP 请求。例如， fetch() 和 XMLHttpRequest 遵循同源策略。这意味着使用这些 API 的 Web 应用程序只能从加载应用程序的同一源请求资源，除非来自其他源的响应包含正确的 CORS 标头。

先来看一个 HTTP响应头 示例

200 OK
Access-Control-Allow-Headers: *
Access-Control-Allow-Methods: *
Access-Control-Allow-Origin: *
Connection: Keep-Alive
Content-Encoding: gzip
Content-Type: text/html; charset=utf-8
Cross-Origin-Embedder-Policy: credentialless
Cross-Origin-Opener-Policy: same-origin
Cross-Origin-Resource-Policy: cross-origin
Date: Mon, 18 Jul 2016 16:06:00 GMT
Etag: "c561c68d0ba92bbeb8b0f612a9199f722e3a621a"
Keep-Alive: timeout=5, max=997
Last-Modified: Mon, 18 Jul 2016 02:36:04 GMT
Server: Apache
Set-Cookie: csrftoken=25ab047d8bdf1cf4f6fc8272aaa9d8b8; expires=Mon, 17-Jul-2017 16:06:00 GMT; Max-Age=31449600; Path=/; secure
Transfer-Encoding: chunked
Vary: Cookie, Accept-Encoding
X-Backend-Server: developer2.webapp.scl3.mozilla.com
X-Cache-Info: not cacheable; meta data too large
X-kuma-revision: 1085259
x-frame-options: DENY

跨域隔离

某些 Web API 会增加旁路攻击（例如 Spectre）的风险。为了降低这种风险，浏览器提供了一个基于选择启用的隔离环境，称为“跨域隔离”。在跨域隔离状态下，网页将可以使用特权功能，包括：

API 说明
SharedArrayBuffer 对于 WebAssembly 线程而言是必需的。目前，桌面版在 网站隔离的帮助下默认处于启用状态，但要求使用跨域隔离状态，并且 Chrome 92 中默认停用。
performance.measureUserAgentSpecificMemory() Chrome 89 及更高版本均支持此功能。
performance.now()、performance.timeOrigin 目前适用于许多分辨率限制为 100 微秒或更高的浏览器。使用跨域隔离时，分辨率可以为 5 微秒或更高。

跨域隔离状态还会阻止修改 document.domain。（能够更改 document.domain 允许在同网站文档之间进行通信，这被视为同源政策中的漏洞。）

如需选择启用跨域隔离状态，您需要在主文档上发送以下 HTTP 标头：

Cross-Origin-Embedder-Policy: require-corp
Cross-Origin-Opener-Policy: same-origin

这些标头会指示浏览器阻止加载尚未选择由跨源文档加载的资源或 iframe，并阻止跨源窗口直接与您的文档交互。这也意味着，这些跨源加载的资源需要选择启用才能使用。

您可以通过检查 self.crossOriginIsolated 来确定网页是否处于跨源隔离状态。

HTTP Response Headers

减轻跨域隔离的影响

确定哪些资源将受跨域隔离的影响后，请遵循以下一般准则，了解如何实际选择启用这些跨源资源：

  1. 在图片、脚本、样式表、iframe 等跨源资源中，请设置 Cross-Origin-Resource-Policy: cross-origin 标头。在同一网站资源上，设置 Cross-Origin-Resource-Policy: same-site 标头。
  2. 对于可使用 CORS 加载的资源，请确保已启用 CORS，具体方法是在相应的 HTML 标记中设置 crossorigin 属性（例如 <img src="example.jpg" crossorigin>）。对于 JavaScript 提取请求，请确保将 request.mode 设置为 cors。
  3. 如果您想在已加载的 iframe 中使用 SharedArrayBuffer 等强大功能，请将 allow="cross-origin-isolated" 附加到 <iframe>。
  4. 如果加载到 iframe 或工作器脚本的跨源资源涉及另一层 iframe 或工作器脚本，请以递归方式应用本部分中介绍的步骤，然后再继续。
  5. 确认所有跨源资源都选择启用后，请在 iframe 和工作器脚本上设置 Cross-Origin-Embedder-Policy: require-corp 标头（无论是同源还是跨源，这都是必需的）。
  6. 确保没有需要通过 postMessage() 进行通信的跨源弹出式窗口。启用跨域隔离后，您将无法让这些控件正常运行。您可以将通信移至未跨源隔离的其他文档，或者使用其他通信方法（例如 HTTP 请求）。

问题

1. IFrame credentialless

IFrame credentialless 为开发人员提供了一种使用新的临时上下文在 <iframe> 中加载第三方资源的机制。它无法访问其常规来源的网络、cookie 和存储数据。它使用顶级文档生命周期本地的新上下文。作为回报，可以取消 Cross-Origin-Embedder-Policy (COEP) 嵌入规则，因此设置了 COEP 的文档可以嵌入没有设置 COEP 的第三方文档。

<iframe
  src="https://en.wikipedia.org/wiki/Spectre_(security_vulnerability)"
  title="Spectre vulnerability Wikipedia page"
  width="960"
  height="600"
  credentialless>
</iframe>

ref