想象一個有兩個檔案的站點：index.html和test.jpg，都位于根目錄。index.html有以下內容。
<!DOCTYPE html>
<html lang=en>
<head>
<meta charset=utf-8>
<meta content="text/html; charset=utf-8" http-equiv=content-type>
<title>Test</title>
</head>
<body>
<p>Hello.</p>
<img src="/test.jpg">
</body>
</html>
如果沒有安全標頭，這作業得很好。但是，使用這些標題index.html：
Cross-Origin-Embedder-Policy: require-corp
Cross-Origin-Opener-Policy: same-origin
這個標題在test.jpg：
Cross-Origin-Resource-Policy: same-origin
test.jpgChrome 98 將不再加載它。它net::ERR_BLOCKED_BY_RESPONSE.NotSameOrigin 200在控制臺中報告。
添加以下標頭index.html將導致影像也被 Firefox 97 阻止：
Content-Security-Policy: default-src 'none'; style-src 'self'; img-src 'self'; prefetch-src 'self'; frame-ancestors 'none'; form-action 'none'; upgrade-insecure-requests; block-all-mixed-content; disown-opener; sandbox; base-uri 'none'
（我知道這是很多指令，但我試圖將它們一分為二，但無法弄清楚。）
這里發生了什么？https://example.com并且https://example.com/test.jpg是相同的起源，不是嗎？顯式導航到https://example.com/index.html也阻止加載test.jpg. 我對同源的理解缺少什么？為什么 Chrome 和 Firefox 的處理方式有區別？為什么添加 CSP 會導致 Firefox 開始阻止請求test.jpg？
萬一我錯過了什么，這里是每個請求的完整標頭集（來自 cURL）：
> GET / HTTP/2
> Host: example.com
> user-agent: curl/7.77.0
> accept: */*
>
< HTTP/2 200
< date: Wed, 16 Feb 2022 04:56:43 GMT
< server: Apache
< via: e3s
< last-modified: Wed, 16 Feb 2022 04:43:18 GMT
< content-length: 226
< x-content-type-options: nosniff
< referrer-policy: same-origin
< content-security-policy: default-src 'none'; style-src 'self'; img-src 'self'; prefetch-src 'self'; frame-ancestors 'none'; form-action 'none'; upgrade-insecure-requests; block-all-mixed-content; disown-opener; sandbox; base-uri 'none'
< cross-origin-embedder-policy: require-corp
< cross-origin-opener-policy: same-origin
< etag: "e2-5d81b49ddfad8"
< accept-ranges: bytes
< vary: Accept-Encoding
< content-type: text/html; charset=UTF-8
<
> GET /test.jpg HTTP/2
> Host: example.com
> user-agent: curl/7.77.0
> accept: */*
>
< HTTP/2 200
< date: Wed, 16 Feb 2022 04:52:19 GMT
< server: Apache
< x-content-type-options: nosniff
< referrer-policy: same-origin
< cross-origin-resource-policy: same-origin
< last-modified: Wed, 16 Feb 2022 04:22:59 GMT
< etag: "18692-5d81b013bbe82"
< accept-ranges: bytes
< content-length: 99986
< cache-control: public, max-age=31557600, immutable
< age: 336
< via: e2s
< content-type: image/jpeg
<
uj5u.com熱心網友回復：
我沒有嘗試復制，但是從閱讀本文開始，Firefox 在您對檔案進行沙盒處理時開始阻止是有意義的，這意味著它具有不透明的來源，因此影像將出現跨域。
至于 Chrome，沙盒是否也會以某種方式生效？
轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/427685.html
標籤：http 内容安全策略 跨域嵌入策略 跨域资源策略 跨域开启策略
上一篇：HTTPGET 自定義標頭