车把内联 onclick 安全吗？

Question

我有一个 handlebars 模板运行ning 客户端，它在内联 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。当您单击 link );alert('hello 时，请注意警报是运行。 http://jsfiddle.net/68tme0hr/1/

Answer 1

My question is could someone launch an xss attack by changing their name to some malicious sequence of characters?

是的。车把转义仅保护 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}}">

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

车把内联 onclick 安全吗？

Handlebars inline onclick safe?

javascript

security

onclick

handlebars.js

xss

转义JavaScript数据

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