Question

带有default-src或style-src指令的Content Security Policy会阻止内联样式应用于<style>元素或样式属性。要允许使用内联样式，必须将值unsafe-inline应用于CSP fetch指令。这似乎表明内联样式是不安全的。

虽然内联Javascript是XSS攻击的明显攻击媒介（CSP为pretty much useless且script-src 'unsafe-inline'），但Google Web Fundamentals会考虑内联样式to be a relatively equivalent threat，提供one example 2009年博客文章中一个聪明的数据泄露方法。

另一方面，另一个Web Fundamentals article表明内联样式可以帮助优化关键渲染路径，因为在浏览器获取外部资源时，第一个涂料不会被阻止。似乎在安全性和性能之间存在非常真实的权衡：

一般来说，内联样式的风险有多大？

Answer 1

从 is-an-exploit-possible 的角度来看，是的，内联样式和内联JavaScript一样危险。但是，利用这些漏洞的情况要少得多。

有一些方法可以恶意使用CSS，最常见的方法是注入图像。（至少）有两种可能的方式：

div {
  background-image: url("evil.png");
}

img {
  content:url("evil.png").
}

允许用户强行使用＆＃39;要渲染的图像是非常危险的，因为您可以使用PHP来欺骗图像的内容 - 您可以从查看PHP图像的人（例如他们的cookie，浏览器甚至操作系统）中挖掘各种信息。更糟糕的是图像会正确渲染，因此观看图像的人甚至不会注意到任何可疑的图像。

考虑用户能够上传图片的其他情况，例如在论坛上设置个人资料图片（最终会成为<img>）。关键在于用户如何能够保存图像，以便其他用户可以呈现它。对于个人资料照片上传，服务器验证通常会阻止用户上传不是图像的文件，或者是恶意图像。验证以background-image或content网址内联注入的图片几乎是不可能的。

除此之外，我们甚至可以通过告知URL 本身运行JavaScript来进一步进一步：

url('javascript: eval(evil)');

正如您所能想象的那样，攻击者几乎可以他们想要的任何。

还有一些罕见的XSS方法，甚至允许直接使用behavior标记和HTC执行JavaScript：

body {
  behavior: url(evilscript.htc);
}

值得注意的是，使用same-origin policy 可利用本身也是如此，not secure也是如此。

基本上，虽然内联样式稍微提高了速度，但正如您所说，安全性和速度之间存在明确的权衡。尽可能避免使用内联样式;）

希望这有帮助！

使用内联样式有哪些风险？

1 个答案: