1.背景
1.1.同源策略
网站的安全模式源于“同源策略”，web浏览器允许第一个web页面中的脚本访问页面中的数据，但前提是两个web页面具有相同的源。此策略防止一个页面的恶意脚本通过该页面的文档访问另一个网页上的敏感数据。
规则：协议、主机、和端口号
安全风险例子：
- 假设你正在访问银行网站但未注销
- 这时候你跳转到另外一个站点
- 该站点注入一些恶意代码(比如：进行交易操作等)
1.2.网页安全漏洞----跨网站脚本XSS
在某些情况下，同源策略的限制性如果太强，其实是不太友好的，比如说大型网站的子域之间的数据传递，开发过程中的一些调试等；但是人类是比较聪明的，利用一些技术、从而放宽策略
但是，跨网站脚本 (XSS)攻击可通过欺骗网站提供恶意代码和计划好的内容来绕过同源政策：通过寻找将恶意脚本注入网页，攻击者可以获得对敏感页面内容，会话cookie以及浏览器代表用户维护的各种其他信息的提升访问权限。
- 盗号
- 强制发送邮件...
2.CSP内容安全策略
为了缓解很大一部分潜在的跨脚本问题，浏览器的扩展程序系统引入了内容安全策略（CSP）的一般概念；简单来说这一技术就是：
开发者明确告诉客户端（制定比较严格的策略和规则），哪些外部资源是可以加载和执行的 ，即使攻击者发现漏洞，但是它是没办法注入脚本的
开发人员可以使用这种工具以各种方式锁定其应用程序，降低内容注入漏洞（如跨站点脚本）的风险，并降低其应用程序执行的权限
3.怎么启用CSP？
可以通过两种方式：
-
一种是通过 HTTP 头信息的Content-Security-Policy的字段
image.png 通过网页的<meta>标签
<meta http-equiv="Content-Security-Policy" content="script-src 'self'">
我们在页面引入一个cdn，但是meta的content只设置为script-src 'self'
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<meta http-equiv="Content-Security-Policy" content="script-src 'self'"/>
<title>Document</title>
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
</head>
那么，我们将会看到如下结果
4.如何设置选项？
举个栗子：
如果我们将meta标签的content白名单增加https://cdn.bootcss.com来源,就不会报错了
<meta http-equiv="Content-Security-Policy" content="script-src 'self' https://cdn.bootcss.com"/>
我们已经看到了script-src如何设置，其实它同样是适用于其他资源的限制
4.1常用
1). script-src: 外部脚本
2). style-src：script-src 版的样式表
3).img-src: 用于定义可从中加载图像的来源。
4).font-src: 用于指定可提供网页字体的来源
5).media-src: 用于限制允许传输视频和音频的来源。
6).object-src: 可对 Flash 和其他插件进行控制。
7).plugin-types: 用于限制页面可以调用的插件种类。
8). child-src: 用于列出适用于工作线程和嵌入的帧内容的网址(框架)
4.2default-src
默认情况下，这些指令的适用范围很广。如果您不为某条指令（例如，font-src）设置具体的政策，则默认情况下，该指令在运行时假定您指定 * 作为有效来源（例如，您可以从任意位置加载字体，没有任何限制）。可以通过指定一个 default-src 指令替换此默认行为
<meta http-equiv="Content-Security-Policy" content="default-src 'self'"/>
上面代码限制所有的外部资源，都只能从当前域名加载
如果同时设置某个单项限制（比如font-src）和default-src，前者会覆盖后者，即字体文件会采用font-src的值，其他资源依然采用default-src的值。
5.内联脚本被视为是有害的
如果攻击者可以注入一个 script 标记，在标记中直接包含一些恶意的负载，则浏览器将无法将它与合法内联脚本标记区分开来。您需要将 script 标记的内容移入外部文件
6.应用
参考文档+引入钉钉JSAPI
