上下文
我的任务是修复菜单编辑页面上的一个大错误,该错误是由过时的元素问题引起的,该问题是由于将HTML元素呈现在服务器端而导致的。在为期三天的针对此错误的斗争中,我从Angular获得了一些启发,并决定尝试使菜单状态能够为页面上的所有内容提供动力(添加/删除类别/项目,以及稍后对添加的模式进行分页) )
某些代码
我想出了这个IIFE(成为MVC的“控制器”。选择器模式点击了它的添加方法,删除按钮点击了它的删除方法。此外,这传递给了模板渲染功能,从字面上看,这是弹出模式时遇到的第一件事):
/* all the categories, items, and modifiers that power this page */
var menuState = (function() {
let _categories = {
attached: [],
available: []
}, _items = {
attached: [],
available: []
}, _modifiers = {
attached: [],
available: []
}
function getExposedMethodsFor(obj) {
return {
all : function() { return obj.attached.concat(obj.available) },
attached : function() { return obj.attached },
available : function() { return obj.available }
// ... other methods that work on obj.attached,obj.available
}
}
let categoryExposedMethods = getExposedMethodsFor(_categories)
// other exposer objects
return {
getAllCategories : categoryExposedMethods.all,
getAttachedCategories : categoryExposedMethods.attached,
getAvailableCategories : categoryExposedMethods.available
// the rest of the exposed methods irrelevant to this question at hand
}
})()
好的,那是什么问题?
问题在于,这似乎是错误的安全感。当我尝试单独进行XSS测试时,它会失败。
我用_categories
中的三个实体(都为attached
)进行了测试,导致
menuState.getAllCategories().length
返回3和
menuState.getAvailableCategories().length
返回0。好消息是,当我尝试
menuState.getAllCategories().push('a')
menuState.getAllCategories().length
我还是三个。
但是,我去的时候
menuState.getAvailableCategories().push('b')
menuState.getAvailableCategories().length
我得到1,而不是0!
真的有办法在这里锁定其他吸气剂吗?!如果没有,我有什么选择?
答案 0 :(得分:0)
我用Object.freeze
修复了它,我已经使用它重构了我在开发人员从事此项目之前编写的“枚举”。它所做的是完全保护状态免受任何类型的更改,包括:
我如何使用
在助手方法中,我执行了以下操作:
attached : function() { return Object.freeze(obj.attached) },
available : function() { return Object.freeze(obj.available) },
这可以防止使用这些方法更改数组,从而关闭此类XSS。另外,menuState
用const
声明。