我是 Backbone 的新手，正在帮助维护一个应用程序。我想在所有正常情况下将 Backbone 设置为默认值以转义模型数据，以帮助避免默认情况下的 XSS 攻击。
我知道我们可以使用
<%- someModelAttribute %>
和
model.escape('attr')
在我们的应用程序中转义数据，但我想这样切换
<%= someModelAttribute %>
和
model.get('attr')
也做了同样的事情......所以默认情况下，所有使用这些标签和方法的现有代码和未来代码都会被默认转义。然后我想介绍另一种模型方法，例如“model.getDataThatShouldBeSafeHtml”，以便开发人员在获取应包含 HTML 的数据时 100% 清楚。
那么有什么方法可以让我将“
我只是问，因为我认为这可能已经在某个地方做过，或者已经是主干的一部分，我想避免重建轮子！
【问题讨论】：
标签： javascript backbone.js xss
我找到了一种简单的方法来制作它，因此默认情况下所有模板都被转义。由于 Backbone 使用 Underscore 作为它的模板引擎，我搜索了一下，发现您可以使用 _.templateSettings 自定义下划线分隔符，描述为 here on the Underscore site。请注意，如果您确保所有的 html 都是使用这些模板写出的，那么您将涵盖所有 XSS。所以不要在一些简单的场景中跳过使用模板，在这些情况下也可以使用它们来避免 XSS！
你可以用这个小提琴来测试它：http://jsfiddle.net/vx0pw2n0/
所以我所做的只是让<%= 和<%- 默认用于显示转义数据。评估标签<% 仍然存在，可以使用print 语句输出您想要的任何HTML。我还介绍了一个新标签<%cleanHtml，它可以用来输出HTML而不用转义，也不需要说print(someVariable)
<script type="text/javascript">
//
// This is the important part - The part that changes what underscore uses
// for template delimiters.
//
_.templateSettings =
{
escape: /<%[=-]([\s\S]+?)%>/g,
interpolate: /<%cleanHtml([\s\S]+?)cleanHtml%>/g,
evaluate: /<%([\s\S]+?)%>/g
};
// Test it out
var t = _.template($('#t').html());
var html = t({ title: '<b>pancakes</b>' });
$("#target").html(html);
console.log(html);
</script>
<!-- Sample Underscore Template showing different ways of using it -->
<script id="t" type="text/x-underscore">
<div><%= title %></div>
<div><%- title %></div>
<div><%safeHtmlOnly title safeHtmlOnly%></div>
<div><% print(title) %></div>
</script>
<div id="target"></div>
要使其在全局范围内工作，您可能必须将 Underscore 配置为模块，可以这样做：
// When you initially setup require.js, add a new module to configure underscore
// Make it a dependency of backbone, so it'll always be loaded whenever
// backbone is used.
require.config({
shim: {
underscore: {
exports: '_'
},
backbone: {
deps: ['underscoreConfig', 'underscore', 'jquery'],
exports: 'Backbone'
},
jquery: {
exports: 'jQuery'
}
}
});
define(['underscore'], function (_) {
'use strict';
_.templateSettings =
{
escape: /<%[=-]([\s\S]+?)%>/g,
interpolate: /<%cleanHtml([\s\S]+?)cleanHtml%>/g,
evaluate: /<%([\s\S]+?)%>/g
};
return _;
});
【讨论】：
您可以扩展 Backbone.Model 以创建一个可重用的基类来为您执行此操作。像这样的东西（未经测试）：
BaseModel = Backbone.Model.extend({
getSafeAttributes: function() {
var safe = {};
_.each(this.attributes, function(key, value) {
safe[key] = _.escape(value);
});
return safe;
}
});
我猜你的 render 函数看起来像
this.$el.html(this.template(this.model.attributes));
所以，你应该写：
this.$el.html(this.template(this.model.getSafeAttributes()));
并确保您的模型扩展基类而不是 Backbone.Model。
修改backbone.js 和underscore.js 以达到类似的结果是完全可以接受的，但是升级确实很痛苦，这就是我改用基类的原因。
【讨论】：
getSafeAttributes 方法，因为模板引擎无法将对象作为值处理。
据我所知主干取决于下划线提供的模板引擎。
How to use underscore.js as a template engine?
通过下划线，您可以将正则表达式模式更改为始终转义，但它不会调用模型的转义方法，因此您必须创建自己的模板引擎来执行此操作...
例如，您可以从下划线分叉模板代码并以自己的方式开发并使用它来代替_.template()。
【讨论】：