我试图找出任何和所有方法来防止特定元素的 CSS 修改和 DOM 修改。我知道这可能不是完全可能的,或者有才华的开发人员可以绕过它,但是,我并不担心人们可能会绕过它,我只是想阻止新手。特别是那些使用 jQuery 的人。一个例子是删除原型对象等的某些属性。
6 回答
Don't use CSS or JavaScript :p Depend completely on server side checks etc.
但是为什么你需要/想要这个?如果你想“保护”你的代码,你可以使用一些 JavaScript minifier 作为 Google Closure Compiler 或 YUI 压缩器。他们将重写您的脚本,并且人类很难阅读。如今,使用 Firebug 和 Grease Monkey 之类的工具几乎不可能做你想做的事。
您无法阻止任何人弄乱您的 javascript 或页面中的对象。浏览器的设计方式,页面中的代码和对象根本不受保护。从小书签到在控制台输入的 javascript 再到浏览器插件,一切都会弄乱您的页面、代码和变量。这就是浏览器的架构。
你能做的就是让事情变得更加困难,以至于有些事情需要做更多的工作。以下是您可以做的几件事:
- 混淆/压缩/最小化你的代码会做一些事情,比如删除注释、删除空格、删除一些换行符、缩短变量名等......这不会阻止任何人修改东西,但确实让理解和弄清楚变得更加困难。
- 将变量放在闭包中而不使用全局变量。这使得直接从脚本外部修改变量变得更加困难。
- 将所有重要数据和机密保存在您的服务器上。使用 ajax 调用请求服务器使用该数据或机密执行操作,这样重要信息在浏览器客户端中永远不可用。
你不能阻止任何人修改 DOM。根本没有针对这种情况的保护措施。如果 DOM 以非标准方式被弄乱,您的代码可以检查 DOM 并拒绝操作。但是,当然,代码也会被修改以删除该检查。
如果您正在寻找特定于 jquery 的解决方案,一种粗略的方法将涉及更改 jQuery ($) 函数并将其替换为仅在提供的选择器与您要保护的元素不匹配时委托给原始函数的自定义函数。
(function(){
jQueryOrig = jQuery;
window.jQuery = window.$ = function(){
if (jQueryOrig("#secure").is(arguments[0])) {
throw new Error("Security breach");
} else return jQueryOrig.apply(this, arguments);
}
}());
当然,使用直接 DOM 操作的人不会受到影响。
此外,如果您实际上在生产代码中包含任意第三方代码,您应该查看 Caja ( http://code.google.com/p/google-caja/ ),它将用户限制为 javascript 的子集能力。这里有一个关于 Caja 的很好的解释:http: //due-diligence.typepad.com/blog/2008/04/web-20-investor.html。
您可以在 Flash 中制作所有内容。在 Chrome 中,如果 flash 元素有焦点,甚至还有一个错误会阻止用户打开控制台(不确定这是如何工作的,但您可以在http://www.twist-cube.com或http:// /www.gotmilk.com)。即使用户确实设法打开了控制台(这并不难......),您仍然可以做的就是改变元素的形状。
这是可能的,但需要始终从您的服务器加载 JS 文件。使用观察者可以锁定 CSS 属性,使用 DOM 移除/添加监听器可以将其锁定到父级。这足以阻止大多数修改。
实际上,您可以更进一步,修改核心 javascript 函数,从而在不本地或通过代理加载 JS 文件的情况下几乎不可能修改 DOM。进一步的安全性可以通过做额外的域检查来确保 JS 文件是从它应该被加载的地方加载的。