「网络」CSP和Nonce

微信扫一扫,分享到朋友圈

「网络」CSP和Nonce

浏览器无法区分JS的来源,有的JS是来自应用本身的,而有的则有可能来自恶意注入。由于浏览器无法区分JS的来源,这可能会被XSS攻击所利用。

什么是XSS?

例如在一个博客网站,发表一篇包含恶意脚本的 <script> 标签的文章,这篇文章会保存在服务器中。当其他人访问这篇文章时,会在访问者的浏览器中执行恶意的脚本。因为浏览器无法区分JS代码是好的,还是坏的。浏览器都会下载并执行JS。

CSP(Content-Security-Policy)

Content-Security-Policy 的 HTTP Header 可以指示浏览器只信任指定白名单的JS源。即使通过XSS攻击注入了恶意的脚本文件,浏览器也不会执行。

CSP Nginx 示例

server {
listen 8090;
server_name localhost;
root /Users/zhangyue/Desktop/csp;
index index.html;
add_header Content-Security-Policy "script-src 'self';";
location ~* .(?:js|css)$ {
expires 7d;
add_header Cache-Control no-store;
}
}
复制代码

添加CSP之前

jqeury的cdn可以正常被加载

添加CSP之后

添加CSP后,浏览器只会抛出一个错误,不会执行任何白名单之外的JS代码

其他资源

除了javascript外,CSP还可以对网站的其他的资源进行限制

  • style-src 限制css的资源地址
  • img-src 限制图片的资源地址
  • font-src 限制字体资源的地址
  • …… 等等
# img-src 为图片资源增加白名单
server {
add_header Content-Security-Policy "script-src 'self';";
# 只允许http://photocdn.sohu.com; 和 当面域名下的图片进行加载
add_header Content-Security-Policy "img-src 'self' http://photocdn.sohu.com;";
}
复制代码

但是值得注意的是,如果你不在nginx中对具体(css,js,image……)的资源作出限制,那么就代表不限制资源的来源。默认可以加载任何来源的资源。

使用 default-src 可以为没有指定白名单的资源,提供一个默认的白名单。

server {
listen 8090;
server_name localhost;
index index.html;
# default-src 为没有提供的资源提供了白名单: 'self',只允许加载当前域名下的资源
add_header Content-Security-Policy "script-src 'self';img-src 'self' http://photocdn.sohu.com;default-src 'self'";
}
复制代码

http-equiv

除了通过配置Nginx,为页面添加CSP。还可以通过 meta 标签的http-equiv的属性,添加页面添加CSP。http-equiv可以为content属性值提供,提供http头。

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- 添加CSP -->
<meta http-equiv="Content-Security-Policy" content="script-src 'self';img-src 'self' http://photocdn.sohu.com;default-src 'self'">
<title>Document</title>
</head>
<body>
</body>
</html>
复制代码

内联脚本

设置CSP,默认是静止内联JS代码执行的。如果一定要执行内联的JS代码,可以将 script-src 设置为 ‘unsafe-inline’ ,以允许内联JS的执行。

server {
listen 8090;
server_name localhost;
index index.html;
# 允许内联js和本域名下的js执行
add_header Content-Security-Policy "script-src 'self' 'unsafe-inline';";
}
复制代码

nonce

如果你担心内联脚本的JS注入,但是又需要内联JS的执行。可以使用nonce属性。CSP Header会返回一个随机字符串,当它与script标签的nonce属性相匹配时,说明这段内联的js是安全的,是可以执行的。

但是这个随机字符串,应当是唯一,不应该是写死的。下面的例子,只是为了说明。如果是固定的nonce值,那么nonce没有任何意义,因为攻击者可以将自己注入的script标签也添加上相同的nonce值。

server {
listen 8090;
server_name localhost;
index index.html;
# 一个随机的字符串
add_header Content-Security-Policy "script-src 'nonce-EDNnf03nceIOfn39fn3e9h3sdfa' 'self';";
}
复制代码

参考

微信扫一扫,分享到朋友圈

「网络」CSP和Nonce

Kubernetes--Ingress实践

上一篇

Windows 10 20H2功能更新离发布更近了一步

下一篇

你也可能喜欢

「网络」CSP和Nonce

长按储存图像,分享给朋友