第三方内容在其沙箱区域内具有强大的能力。如果你担心恶意用户诱使你的网站加载第三方资源,可以通过 CSP 用作防护手段,其可以限制加载图片,脚本和样式的来源。
第三方图片
<img src="https://example.com/kitten.jpg">
第三方脚本
<script src="https://example.com/script.js"></script>
-
读取/修改页面内容。
-
监听用户的所有交互。
-
运行耗费大量计算资源的代码(如 cryptocoin 挖矿程序)。
-
通过向本站发请求,这样能附带用户的 cookie,转发响应。(译注:盗取用户的 cookie 及其他数据)
-
读取/修改本地存储。
-
......可以做任何对方想做的事情。
第三方CSS
<link rel="stylesheet" href="https://example.com/style.css">
-
删除/添加/修改页面内容。
-
根据页面内容发起请求。
-
可响应多种用户交互。
键盘记录器
input[type="password"][value$="p"] {
background: url('/password?p');
}
消失的内容
body {
display: none;
}
html::after {
content: 'HTTP 500 Server Error';
}
添加内容
.price-value::before {
content: '1';
}
移动内容
.delete-everything-button {
opacity: 0;
position: absolute;
top: 500px;
left: 300px;
}
读取属性
<input type="hidden" name="csrf" value="1687594325">
<img src="/avatars/samanthasmith83.jpg">
<iframe src="//cool-maps-service/show?st-pancras-london"></iframe>
<img src="/gender-icons/female.png">
<div></div>
监听交互
.login-button:hover {
background: url('/login-button-hover');
}
.login-button:active {
background: url('/login-button-active');
}
读取文本
@font-face {
font-family: blah;
src: url('/page-contains-q') format('woff');
unicode-range: U+85;
}
html {
font-family: blah, sans-serif;
}
第三方内容不安全