前端安全配置 Content-Security-Policy(csp)

简介: 前端安全配置 Content-Security-Policy(csp)

先说一下场景,因为公司用了微软的rdlc报表,14版会默认加载一个js,但是这个js最近被墙了,需要翻墙才能正常访问。而这个js正影响着报表的加载速度。多番研究,发现csp可以解决。


什么是CSP


CSP全称Content Security Policy ,可以直接翻译为内容安全策略,说白了,就是为了页面内容安全而制定的一系列防护策略. 通过CSP所约束的的规责指定可信的内容来源(这里的内容可以指脚本、图片、iframe、fton、style等等可能的远程的资源)。通过CSP协定,让WEB处于一个安全的运行环境中。


有什么用?


我们知道前端有个很著名的”同源策略”,简而言之,就是说一个页面的资源只能从与之同源的服务器获取,而不允许跨域获取.这样可以避免页面被注入恶意代码,影响安全.但是这个策略是个双刃剑,挡住恶意代码的同时也限制了前端的灵活性,那有没有一种方法既可以让我们可以跨域获取资源,又能防止恶意代码呢?


答案是当然有了,这就是csp,通过csp我们可以制定一系列的策略,从而只允许我们页面向我们允许的域名发起跨域请求,而不符合我们策略的恶意攻击则被挡在门外.从而实现


需要说明的一点是,目前主流的浏览器都已支持csp.所以我们可以放心大胆的用了.


指令说明


指令就是csp中用来定义策略的基本单位,我们可以使用单个或者多个指令来组合作用,功能防护我们的网站.



参考链接:


https://www.cnblogs.com/heyuqing/p/6215761.html


https://content-security-policy.com/


只能从你自己的网站(自我)加载脚本。然后从另一个网站(www.google.com)加载脚本


如下设置:


<meta http-equiv="Content-Security-Policy" content="default-src *;
相关文章
|
1月前
|
前端开发 JavaScript
前端常用的ESlint配置
前端常用的ESlint配置
37 1
|
16天前
|
前端开发 应用服务中间件 nginx
Nginx配置详解Docker部署Nginx使用Nginx部署vue前端项目
Nginx配置详解Docker部署Nginx使用Nginx部署vue前端项目
78 0
|
7月前
|
前端开发 Java
(前后端分离)SpringBoot配置全局跨域,前端一访问就报错的原因竟然是这个
(前后端分离)SpringBoot配置全局跨域,前端一访问就报错的原因竟然是这个
172 0
|
1月前
|
前端开发 小程序 编译器
前端开发新电脑配置(菜菜最为 详细的配置)
前端开发新电脑配置(菜菜最为 详细的配置)
|
5月前
|
JavaScript 前端开发
前端vue配置多个代理 axios的使用
前端vue配置多个代理 axios的使用
76 0
|
2月前
|
前端开发 JavaScript Windows
前端秘法引言(配置vscode, 以及html的基础)
前端秘法引言(配置vscode, 以及html的基础)
175 0
|
6月前
|
前端开发 Java 应用服务中间件
配置SpringMVC的前端控制器DispatcherServlet时,<url-pattern>中“/“和“/*“的区别
配置SpringMVC的前端控制器DispatcherServlet时,<url-pattern>中“/“和“/*“的区别
|
2月前
|
前端开发 JavaScript Unix
前端常用的时间格式配置格式
前端常用的时间格式配置格式
|
3月前
|
缓存 前端开发 安全
前端反向代理的神奇世界:加速、安全与缓存的秘密(下)
前端反向代理的神奇世界:加速、安全与缓存的秘密(下)
|
3月前
|
缓存 负载均衡 前端开发
前端反向代理的神奇世界:加速、安全与缓存的秘密(上)
前端反向代理的神奇世界:加速、安全与缓存的秘密(上)
前端反向代理的神奇世界:加速、安全与缓存的秘密(上)