信息安全 - 允许 CSS filter: url(data:<SVG SOURCE HERE>) 是否安全？ - 吾爱随笔录

信息安全网页浏览器网址白名单 css

2021-09-11 13:51:57

我们有一个 Web 服务，登录用户可以在其中创建网页内容并为他们的页面编写自定义 CSS。所有 HTML 都经过白名单解析器，并且不允许任何可执行内容。所有的 CSS 都通过一个验证所有 CSS 的白名单解析器。

以这种方式使用时，浏览器似乎不会执行嵌入在 SVG 文件中的JavaScript

selector
{
    filter: url("data:image/svg+xml;base64,...#filter");
}

但是，我找不到说明浏览器不应在该数据 URL 中运行 JavaScript 的规范。

允许在属性中使用data:URL是否安全？url()filter我主要考虑 XSS 攻击，但我显然也想了解其他漏洞。

预期的用例是例如允许自定义内容过滤到主题颜色，因此不需要在 SVG 中允许 JS。我基本上想知道我是否可以安全地添加规则，说明在属性中使用前缀data:image/svg+xml是 CSS 函数的安全值。urlfilter

我也知道Content-Security-Policy需要包含data:在中，default-src因为规范未能更好地定义 SVG 处理。结果，我也需要script-src 'self'; object-src 'self'.

1个回答

我知道的最好的规范是 W3C Editor's Draft SVG Integration它说例如

为使 SVG 遵守 Web 平台的安全模型，需要禁用某些 SVG 功能，具体取决于 SVG 文档的使用方式。例如，HTML 'img' 元素引用的 SVG 文档需要禁用脚本。

在非规范性介绍中。

它resource-document-mode在规范性文本中定义并说

由于从以下任何功能引用外部文档而加载的 SVG 文档必须使用资源文档引用模式：
[...]
剪辑路径、光标、填充、过滤器描边、标记中间、标记开始、标记结束和掩码属性

但是，这并没有列出该filter属性，因此其状态仍然未知。我认为该规范的意图是说它不应该执行脚本。

2021 年 12 月更新：似乎filter已将其添加到当前草案的规范文本中，因此我对意图的猜测是正确的：https ://svgwg.org/specs/integration/#resource-document-mode

因此，一旦 SVG 集成规范最终确定，允许data:CSSfilter属性的 url 应该是安全的（但也要确保测试真实世界的浏览器），因为脚本内容不会在那里执行。

其它你可能感兴趣的问题