内容安全策略
This article is part of a series created in partnership with SiteGround. Thank you for supporting the partners who make SitePoint possible.
本文是与SiteGround合作创建的系列文章的一部分。 感谢您支持使SitePoint成为可能的合作伙伴。
The web is based on a “same-origin” policy. Only code at mysite.com can access mysite.com’s data in cookies, localStorage, Ajax requests etc. It is isolated from other domains so any access attempts from evilsite.com will be rejected.
网络基于“同源”政策。 只有在代码可以mysite.com访问mysite.com的数据，饼干，本地存储，AJAX请求等，这是其他域的隔离，从而从evilsite.com任何访问尝试将被拒绝。
Unfortunately, it’s never that simple. Modern websites are complex and load a variety of third-party components, styles and scripts. A script loaded from another domain runs in the context of the current page and can do whatever it likes. That social networking button could monitor visitors, hijack login cookies, change page content and more. Even if you trust the third-party site, you could become victim to a man-in-the-Middle attack where the script is changed before it reaches you. Alternatively, it could permit users to launch their own Cross Site Scripting attacks (XXS).
不幸的是，这从未如此简单。 现代网站非常复杂，并加载了各种第三方组件，样式和脚本。 从另一个域加载的脚本在当前页面的上下文中运行，并且可以执行其喜欢的任何操作。 该社交网络按钮可以监视访客，劫持登录Cookie，更改页面内容等。 即使您信任第三方站点，您也可能成为中间人攻击的受害者，这种中间人攻击在脚本到达您之前就对其进行了更改。 或者，它可以允许用户发起自己的跨站点脚本攻击(XXS) 。
By default, browsers implement an anything-goes approach. Fortunately, it’s possible to apply restrictions using a Content Security Policy (CSP) which prevent unexpected security issues. A CSP tells the browser what’s permitted, e.g. run JavaScript at mysite.com but only from files and not inline <script> tags.
默认情况下，浏览器实施一切皆有可能的方法。 幸运的是，可以使用内容安全策略(CSP)来应用限制，以防止意外的安全问题。 CSP告诉浏览器允许的内容，例如，在mysite.com上运行JavaScript，但仅从文件而不是内嵌<script>标记运行。
测试您的网站 (Test Your Website)
To check whether CSP is implemented on your site, visit observatory.mozilla.org, enter a page URL and hit Scan Me. Those with no CSP protection are likely to score an F (although various other checks are made).
要检查您的站点上是否实施了CSP，请访问observatory.mozilla.org ，输入页面URL并点击Scan Me 。 那些没有CSP保护的人很可能得分为F (尽管进行了各种其他检查)。
CSP should be considered essential for banks, online stores, social networks and any site which implements user accounts. It’s less necessary if your site doesn’t use third-party scripts, fonts, media, widgets or analytics but can you be sure it never will?
对于银行，在线商店，社交网络以及任何实施用户帐户的网站，CSP应该被视为必不可少的。 如果您的网站不使用第三方脚本，字体，媒体，小部件或分析，则不必要，但是您可以确定它永远不会使用吗？
实施内容安全策略 (Implementing a Content Security Policy)
A Content Security Policy must be added to each page by your developer or web host. It’s defined using a Content-Security-Policy HTTP header set by a server-side language (PHP, Node.js, Ruby etc.) or within the server configuration such as Apache’s .htaccess file, e.g.
开发人员或网络托管商必须将内容安全策略添加到每个页面。 它是通过服务器端语言(PHP，Node.js，Ruby等)或服务器配置(例如Apache的.htaccess文件)中设置的Content-Security-Policy HTTP标头定义的
# Apply a CSP to all HTML and PHP files
<FilesMatch "\.(html|php)$">
Header set Content-Security-Policy "policy-definition"
</FilesMatch>(We’ll discuss the “policy-definition” value shortly.)
(我们稍后将讨论“策略定义”值。)
Server configuration files are practical because they apply the same header to all pages within the sub-folder hierarchy. However, you can also define a policy within the HTML <head> of any page using a meta tag:
服务器配置文件是实用的，因为它们将相同的标头应用于子文件夹层次结构中的所有页面。 但是，您还可以使用meta标签在任何页面HTML <head>中定义策略：
<meta http-equiv="Content-Security-Policy" content="policy-definition">This may be necessary if you don’t have permission to configure the server or require differing policies on each page.
如果您无权配置服务器或在每个页面上要求不同的策略，则可能有必要。
内容安全策略定义 (Content Security Policy Definition)
Now for the complex part. CSPs define a whitelist of permitted domains and contexts for differing types of content.
现在为复杂的部分。 CSP为不同类型的内容定义了允许的域和上下文的白名单。
Presume you only want to permit scripts loaded from your domain. You could use the following CSP (please don’t do this for real yet — it’s just an example!):
假设您只想允许从您的域中加载脚本。 您可以使用以下CSP (请暂时不要这样做-这只是一个示例！) ：
script-src 'self';You then realise you’re also loading a third-party library from a CDN which can appear on various sub-domains of mycdn.com. A domain wildcard is added to the space-separated list:
然后，您意识到您还从CDN加载了一个第三方库，该库可能出现在mycdn.com各个子域中。 域通配符将添加到以空格分隔的列表中：
script-src 'self' *.mycdn.com;You then remember some of your scripts run inline on the page — we can define that too:
然后，您还记得一些脚本在页面上内联运行-我们也可以定义它：
script-src 'self' *.mycdn.com 'unsafe-inline';We now have a policy for scripts. However, we’ve not defined other types so all stylesheets, images, fonts, etc. would fail to load. To solve this, we can apply a default policy using default-src which serves as a fallback for any undefined type:
现在，我们有一个脚本策略。 但是，我们尚未定义其他类型，因此所有样式表，图像，字体等都将无法加载。 为了解决这个问题，我们可以使用default-src应用默认策略，该策略可作为任何未定义类型的后备：
default-src 'self'; script-src 'self' *.mycdn.com 'unsafe-inline';Note that each content type definition is separated with a semi-colon (;). We can now use this policy in our .htaccess file:
请注意，每个内容类型定义都用分号(;)分隔。 现在，我们可以在.htaccess文件中使用此策略：
Header set Content-Security-Policy "default-src 'self'; script-src 'self' *.mycdn.com 'unsafe-inline';"or a page meta tag:
或页面元标记：
<meta http-equiv="Content-Security-Policy"
content="default-src 'self'; script-src 'self' *.mycdn.com 'unsafe-inline';">CSP指令参考 (CSP Directive Reference)
The full set of CSP directives:
全套CSP指令：
| directive | description |
|---|---|
default-src | the default fallback policy. Typically set to 'self' or 'none' to ensure all other directives must be declared |
style-src | valid stylesheet sources |
script-src | valid JavaScript sources |
connect-src | valid Ajax, WebSocket or EventSource sources for JavaScript data retrieval |
form-action | valid sources for form action attributes |
img-src | valid image sources |
font-src | valid font sources |
media-src | valid HTML5 audio and video element sources |
object-src | valid plugin sources for HTML object, embed and applet elements |
plugin-types | valid MIME types for plugins invoked by object and embed, e.g. application/pdf |
frame-src | valid frame and iframe sources (now deprecated — use child-src instead) |
child-src | valid frame and iframe sources |
frame-ancestors | valid embedding sources for frame, iframe, object, embed and applet elements |
sandbox | enables a sandbox for the resource in a similar way to the HTML5 iframe sandbox attribute. This has a number of restrictions unique to this directive: allow-forms, allow-same-origin, allow-scripts, allow-popups, allow-modals, allow-orientation-lock, allow-pointer-lock, allow-presentation, allow-popups-to-escape-sandbox, and allow-top-navigation |
report-uri | an address where the browser can POST reports of policy failures |
| 指示 | 描述 |
|---|---|
default-src | 默认的后备策略。 通常设置为'self'或'none'以确保必须声明所有其他指令 |
style-src | 有效的样式表源 |
script-src | 有效JavaScript来源 |
connect-src | 用于JavaScript数据检索的有效Ajax，WebSocket或EventSource源 |
form-action | form动作属性的有效来源 |
img-src | 有效的图像来源 |
font-src | 有效的字体来源 |
media-src | 有效HTML5 audio和video元素来源 |
object-src | HTML object ， embed和applet元素的有效插件源 |
plugin-types | object和embed调用的插件的有效MIME类型，例如application/pdf |
frame-src | 有效的frame和iframe源(现已弃用，请改用child-src ) |
child-src | 有效的frame和iframe来源 |
frame-ancestors | 有效的frame ， iframe ， object ， embed和applet元素的嵌入源 |
sandbox | 启用资源的沙箱的方式类似于HTML5 iframe沙箱属性 。 该指令具有许多独特的限制： allow-forms ， allow-same-origin ， allow-scripts ， allow-popups ， allow-modals ， allow-orientation-lock ， allow-pointer-lock ， allow-presentation ， allow-popups-to-escape-sandbox并allow-top-navigation |
report-uri | 浏览器可以在其中发布POST策略失败报告的地址 |
CSP来源参考 (CSP Sources Reference)
The CSP source directives ending -src support the following values. Any number of space-separated values can be used:
以-src结尾的CSP源指令支持以下值。 可以使用任意多个以空格分隔的值：
| source | description |
|---|---|
'none' | prevents loading from any source, e.g. frame-ancestors 'none' stops the page showing any iframe or plugin. The value cannot be followed by other sources |
'self' | allows loading from sources on the same origin (protocol, domain/IP and port) |
https: | only allows sources on HTTPS connections |
data: | permits data: sources, e.g. style-src data: allows base64-encoded images in your stylesheets |
* | wildcard for any URL |
*.domain.com | permits sources from any sub-domain of domain.com, i.e. www.domain.com, cdn.domain.com, etc. |
exact.domain.com | permits sources from exact.domain.com |
https://exact.domain.com/ | permits HTTPS sources on the given domain |
'unsafe-inline' | permits inline CSS, scripts, javascript: URIs, and element event handlers such as onclick within the HTML |
'unsafe-eval' | permits unsafe dynamic code using JavaScript’s eval() function |
'nonce-id' | permits an inline CSS or script to run if the id matches the nonce attribute value, e.g. script-src 'nonce-abc123' runs inline code within a <script nonce="abc123">...</script> block |
'sha256-hash' | permits styles or scripts if the file content matches the generated SHA-256 hash value |
| 资源 | 描述 |
|---|---|
'none' | 防止从任何来源加载，例如frame-ancestors 'none'停止显示任何iframe或插件的页面。 该值不能跟随其他来源 |
'self' | 允许从相同来源的源(协议，域/ IP和端口)进行加载 |
https: | 仅允许HTTPS连接上的源 |
data: | 允许数据：来源，例如style-src data:允许样式表中以base64编码的图像 |
* | 任何URL的通配符 |
*.domain.com | 允许来自domain.com的任何子域的资源，即www.domain.com，cdn.domain.com等。 |
exact.domain.com | 允许来自精确的域名 |
https://exact.domain.com/ | 允许给定域上的HTTPS源 |
'unsafe-inline' | 允许内联CSS，脚本， javascript: URI和HTML中的onclick等元素事件处理程序 |
'unsafe-eval' | 使用JavaScript的eval()函数允许不安全的动态代码 |
'nonce- id ' | 如果id与现时属性值匹配，则允许运行内联CSS或脚本，例如script-src 'nonce-abc123'在<script nonce="abc123">...</script>块内运行内联代码 |
'sha256- hash ' | 如果文件内容与生成的SHA-256哈希值匹配，则允许样式或脚本 |
CSP开发建议 (CSP Development Recommendations)
It’s practical to start with a strict default policy of default-src 'none'; then add further permissions as required. A good starting point for the majority of websites could be:
从严格的默认策略default-src 'none';开始是可行default-src 'none'; 然后根据需要添加其他权限。 对于大多数网站来说，一个好的起点可能是：
default-src 'none'; style-src 'self' data:; img-src 'self' data:; script-src 'self'; connect-src 'self';This permits styles, images, scripts and Ajax requests from the same origin.
这允许来自相同来源的样式，图像，脚本和Ajax请求。
Open your page in a web browser then launch the developer tools console. Blocked resource warnings will be reported, e.g.
在网络浏览器中打开页面，然后启动开发人员工具控制台。 将报告阻塞的资源警告，例如
Refused to load the script 'XXX' because it violates the following Content Security Policy directive: "YYY".You may need to browse various pages to ensure you’ve accounted for all the fonts, images, videos, scripts, plugins and iframes your site requires.
您可能需要浏览各个页面，以确保您已考虑了网站所需的所有字体，图像，视频，脚本，插件和iframe。
Google服务 (Google Services)
Google provides a great range of services and you’re possibly using analytics, fonts, maps and more. Unfortunately, these are enabled on a range of URIs which require further Ajax calls, inline execution and data schemes. You may end up with a convoluted policy such as:
Google提供了广泛的服务，您可能正在使用分析，字体，地图等。 不幸的是，它们在需要进一步Ajax调用，内联执行和数据方案的一系列URI上启用。 您可能最终会遇到一个复杂的策略，例如：
default-src 'self';
style-src 'self' 'unsafe-inline' *.googleapis.com;
script-src 'self' *.google-analytics.com *.googleapis.com data:;
connect-src 'self' *.google-analytics.com *.googleapis.com *.gstatic.com data:;
font-src 'self' *.gstatic.com data:;
img-src * data:;(Line breaks have been added for clarity but must not be used in real code.)
(为清楚起见，添加了换行符，但不得在实际代码中使用。)
This cannot be avoided at the time of writing and other third-party vendors will have similar challenges.
在撰写本文时，这是无法避免的，其他第三方供应商也将面临类似的挑战。
再次测试 (Test Again)
Finally, re-test your pages again at observatory.mozilla.org and, with luck, your Content Security Policy grade has improved significantly. The tool will also advise about older browsers, HTTPS, CORS, MIME, cookies, referrer and redirection policy headers.
最后，再次在observatory.mozilla.org上重新测试您的页面，幸运的是，您的内容安全策略等级得到了显着提高。 该工具还将建议有关较旧的浏览器，HTTPS，CORS，MIME，cookie，引荐来源网址和重定向策略标头。
Implementing a Content Security Policy is an important step in the prevention of unexpected security issues. Another important step is the selection of a hosting provider that takes security to heart. Our partner, SiteGround, is a great option for anyone looking for a web hosting platform built for advanced website security.
实施内容安全策略是防止意外安全问题的重要步骤。 另一个重要的步骤是选择要考虑安全性的托管服务提供商。 我们的合作伙伴SiteGround对于正在寻找可增强网站安全性的网络托管平台的任何人来说都是一个不错的选择。
翻译自: https://www.sitepoint.com/content-security-policy-getting-started/
内容安全策略
3021
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
