这个禁止项不仅包括脚本中嵌入的script标签,还包括内联事件处理程序和javascrpt:这种URL。你需要把script标签的内容放到一个外部文件里,并且用适当的addEventListener的方式替换javascript:和<a…onclick=”[JAVASCRIPT]”>。例如,你可能会把下面的表单:
<script>
function doAmazingThings() {
alert('YOU AM AMAZING!');
}
</script>
<button onclick='doAmazingThings();'>Am I amazing?</button>
重写为下面的形式:
<!-- amazing.html -->
<script src='amazing.js'></script>
<button id='amazing'>Am I amazing?</button>
// amazing.js
function doAmazingThings() {
alert('YOU AM AMAZING!');
}
document.addEventListener('DOMContentReady', function () {
document.getElementById('amazing')
.addEventListener('click', doAmazingThings);
});
无论是否使用CSP,以上的代码其实有更大的优点。内联JavaScript完全混合了结构和行为,你不应该这么做。另外外联资源更容易进行浏览器缓存,开发者更容易理解,并且便于编译和压缩。如果采用外联代码,你会写出更好的代码。
内联样式需要以同样的方式进行处理,无论是style属性还是style标签都需要提取到外部样式表中。这样可以防止各式各样神奇的数据泄漏方式。
如果你必须要有内联脚本和样式,可以为script-src or style-src属性设定'unsafe-inline值。但是不要这样做,禁止内联脚本是CSP提供的最大安全保证,同时禁止内联样式可以让你的应用变得更加安全和健壮。这是一个权衡,但是非常值得。
Eval
即便攻击者不能直接注入脚本,他可能会诱使你的应用把插入的文本转换为可执行脚本并且自我执行。eval() , newFunction() , setTimeout([string], ...) 和setInterval([string], ...) 都可能成为这种危险的载体。CSP针对这种风险的策略是,完全阻止这些载体。
这对你构建应用的方式有一些影响:
通过内置的JSON.parse解析JSON,而不依靠eval。IE8以后的浏览器都支持本地JSON操作,这是完全安全的。
通过内联函数代替字符串来重写你setTimeout和setInterval的调用方式。例如:
setTimeout("document.querySelector('a').style.display = 'none';", 10);
可以重写为:
setTimeout(function () { document.querySelector('a').style.display = 'none'; }, 10);









