如何在不引入 XSS 的情况下允许用户控制 CSS？

Posted 2023-02-19

【中文标题】如何在不引入 XSS 的情况下允许用户控制 CSS？

【英文标题】：How can I allow user controlled CSS without introducing XSS?

【发布时间】：2015-12-02 17:36:12

【问题描述】：

我有一个应用程序，我可以根据客户的要求自定义 html 模板。它提供了在创建模板时包含 CSS 样式脚本的规定，该脚本将在生成模板时最后注入。通过这种方式，客户/支持人员可以动态生成各种 HTML 模板。

但是当我给这个项目进行安全扫描时，所有的 CSS 注入都被检测为安全漏洞（XSS 注入）。我的应用程序本身是基于 CSS 注入设计的，因为它需要在没有开发人员参与的情况下创建动态 HTML 模板。

有没有办法在实现应用程序最终结果的同时防止 XSS 安全漏洞？

如果有其他方法，请告诉我。

【参考方案1】：

允许不可信的 CSS 输入是一个 XSS 缺陷，因为它可用于修复 UI。例如，恶意用户可以通过使用相同的样式和定位来使他们的文本和内容看起来像是来自网站本身的权威文本。

请参阅Google Browser Security Handbook 了解更多信息。

有also ways to get script to run via CSS:

javascript 执行的风险。作为一个鲜为人知的特性，一些 CSS 实现允许将 JavaScript 代码嵌入到样式表中。 至少有三种方法可以实现这一目标：通过使用 expression(...) 指令，它提供了评估的能力 任意 JavaScript 语句并将它们的值用作 CSS 范围;通过在属性上使用 url('javascript:...') 指令 支持它；或通过调用特定于浏览器的功能，例如 -moz 火狐的绑定机制。

在 Firefox 2 和 3 上可以通过 -moz-binding 执行脚本。自 Firefox 3 以来，Google 浏览器安全手册似乎没有更新。This post 表示现在已修复此问题，因此必须将 XML 文件可从您自己的域中读取。 XBL 在当前版本的 Firefox 中似乎不可用。 在 Internet Explorer 10 和更早版本中，HTML Components 允许在 CSS 中执行脚本。

您可以通过implementing an HTML5 sandbox 降低内容不受信任的风险。还要考虑implementing a Content Security Policy with sanitisation 以防止用户以任何方式从您的CSS 上下文中转义（我没有看到您的代码，但我想知道用户是否将</style> 作为CSS 的一部分输入，是否允许他们转义样式标签？）。