车把内联点击安全?

Question

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

<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/

Answer 1

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

是的。车把转义仅保护 HTML。

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

有两种基本方法可以处理此问题。

转义 JavaScript 数据

在将数据放入 JS 之前，先将数据传递到JSON.stringify。然后，JS 引擎会将其视为文字。

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

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

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

例如在data-*属性中

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

---

我推荐第二种方法，因为它更简单且更具可读性。