【问题标题】：Handlebars inline onclick safe?车把内联 onclick 安全吗？
【发布时间】：2020-02-07 09:53:19
【问题描述】：

我有一个在客户端运行的车把模板，它会在内联 onclick 中呈现变量，如下所示：

<script id="my-handlebars-template" type="text/x-handlebars-template">
    <button onclick="console.log('{{name}}');">Click Me!</button>
</script>

此车把模板的上下文来自 ajax 调用。 name 是登录屏幕上的用户输入。我的问题是有人可以通过将他们的名字更改为一些恶意的字符序列来发起 xss 攻击吗？例如，如果name 是);alert('hello，车把模板会运行警报吗？根据我的测试，确实如此。这似乎很容易编写不安全的代码。

这是一个带有测试的 jsfiddle。请注意当您单击链接 );alert('hello 时警报是如何运行的。 http://jsfiddle.net/68tme0hr/1/

【问题讨论】：

【解决方案1】：

我的问题是有人可以通过将他们的名字更改为一些恶意的字符序列来发起 xss 攻击吗？

是的。 Handlebars 转义仅保护 HTML。

如果您已经在 JS 中，那么您很容易受到攻击。

有两种基本方法可以解决这个问题。

转义 JavaScript 数据

将数据通过JSON.stringify 传递到 JS 中。然后 JS 引擎会将其视为文字。

请注意，字符串会为您添加引号，您不需要这样做

onclick="console.log({{name_after_json_stringify}});">

将数据放在比 JS 中间更安全的地方

如在data-* 属性中

onclick="console.log(this.dataset.name);" data-name="{{name}}">

我推荐第二种方法，因为它更简单、更易读。

【讨论】：