运行时反射/自省
这是解决其中一些问题的一种方法，我并不认为它是“最好的”方法（根本），而是一种尝试。
如果可以拦截一些“可利用”的函数和方法，并查看“调用”（每次调用）是否来自产生它的服务器，那么这可能很有用，因为我们可以看到调用是否来自“来自稀薄的空气”（开发工具）。
如果要采用这种方法，那么首先我们需要一个函数来获取call-stack 并丢弃不是 FUBU 的函数（由我们自己）。如果这个函数的结果是空的，hazaa！ - 我们没有拨打电话，我们可以继续进行。
一两个字
为了使这尽可能简短和简单，以下代码示例遵循 DRYKIS 原则，即：
- 不要重复自己，保持简单
- “少代码”欢迎高手
- “代码太多& cmets”吓跑大家
- 如果你能读懂代码 - 继续让它漂亮
话虽如此，请原谅我的“速记”，接下来会解释
首先我们需要一些常量和我们的 stack-getter
const MAIN = window;
const VOID = (function(){}()); // paranoid
const HOST = `https://${location.host}`; // if not `https` then ... ?
const stak = function(x,a, e,s,r,h,o)
{
a=(a||''); e=(new Error('.')); s=e.stack.split('\n'); s.shift(); r=[]; h=HOSTPURL; o=['_fake_']; s.forEach((i)=>
{
if(i.indexOf(h)<0){return}; let p,c,f,l,q; q=1; p=i.trim().split(h); c=p[0].split('@').join('').split('at ').join('').trim();
c=c.split(' ')[0];if(!c){c='anon'}; o.forEach((y)=>{if(((c.indexOf(y)==0)||(c.indexOf('.'+y)>0))&&(a.indexOf(y)<0)){q=0}}); if(!q){return};
p=p[1].split(' '); f=p[0]; if(f.indexOf(':')>0){p=f.split(':'); f=p[0]}else{p=p.pop().split(':')}; if(f=='/'){return};
l=p[1]; r[r.length]=([c,f,l]).join(' ');
});
if(!isNaN(x*1)){return r[x]}; return r;
};
在畏缩之后，请记住这是“即时”编写的“概念证明”，但经过测试并且有效。随意编辑。
stak() - 简短说明
- 唯一的 2 个相关参数是第 2 个，其余的都是因为 .. 懒惰（简短回答）
- 两个参数都是可选的
- 如果第一个参数
x 是一个数字，那么例如stack(0) 返回日志中的第一项，或 undefined
- 如果第二个参数
a 是string - 或array，那么例如stack(undefined, "anonymous") 允许“匿名”，即使它在 o 中被“省略”
- 其余代码只是快速解析堆栈，这应该适用于基于 webkit 和 gecko 的浏览器（chrome 和 firefox）
- 结果是一个字符串数组，每个字符串是一个日志条目，由一个空格分隔，如
function file line
- 如果在日志条目中找不到域名（解析前文件名的一部分），则它不会出现在结果中
- 默认情况下，它会忽略文件名
/（完全正确），因此如果您测试此代码，放入单独的.js 文件将产生比index.html（通常）更好的结果 - 或使用任何网络根机制
- 暂时不用担心
_fake_，它在下面的jack函数中
现在我们需要一些工具
bore() - 通过字符串引用获取/设置/抓取对象的某些值
const bore = function(o,k,v)
{
if(((typeof k)!='string')||(k.trim().length<1)){return}; // invalid
if(v===VOID){return (new Function("a",`return a.${k}`))(o)}; // get
if(v===null){(new Function("a",`delete a.${k}`))(o); return true}; // rip
(new Function("a","z",`a.${k}=z`))(o,v); return true; // set
};
bake() - 强化现有对象属性（或定义新属性）的简写
const bake = function(o,k,v)
{
if(!o||!o.hasOwnProperty){return}; if(v==VOID){v=o[k]};
let c={enumerable:false,configurable:false,writable:false,value:v};
let r=true; try{Object.defineProperty(o,k,c);}catch(e){r=false};
return r;
};
烘烤和钻孔 - 概要
这些都是不言自明的，所以，一些简单的例子就足够了
- 使用
bore获取一个属性：console.log(bore(window,"XMLHttpRequest.prototype.open"))
- 使用
bore设置一个属性：bore(window,"XMLHttpRequest.prototype.open",function(){return "foo"})
- 使用
bore撕裂（不小心破坏）：bore(window,"XMLHttpRequest.prototype.open",null)
- 使用
bake 强化现有属性：bake(XMLHttpRequest.prototype,'open')
- 使用
bake定义一个新的（硬）属性：bake(XMLHttpRequest.prototype,'bark',function(){return "woof!"})
拦截函数和构造
现在我们可以利用上述所有优势，因为我们设计了一个简单而有效的拦截器，绝不是“完美的”，但它应该就足够了；解释如下：
const jack = function(k,v)
{
if(((typeof k)!='string')||!k.trim()){return}; // invalid reference
if(!!v&&((typeof v)!='function')){return}; // invalid callback func
if(!v){return this[k]}; // return existing definition, or undefined
if(k in this){this[k].list[(this[k].list.length)]=v; return}; //add
let h,n; h=k.split('.'); n=h.pop(); h=h.join('.'); // name & holder
this[k]={func:bore(MAIN,k),list:[v]}; // define new callback object
bore(MAIN,k,null); let f={[`_fake_${k}`]:function()
{
let r,j,a,z,q; j='_fake_'; r=stak(0,j); r=(r||'').split(' ')[0];
if(!r.startsWith(j)&&(r.indexOf(`.${j}`)<0)){fail(`:(`);return};
r=jack((r.split(j).pop())); a=([].slice.call(arguments));
for(let p in r.list)
{
if(!r.list.hasOwnProperty(p)||q){continue}; let i,x;
i=r.list[p].toString(); x=(new Function("y",`return {[y]:${i}}[y];`))(j);
q=x.apply(r,a); if(q==VOID){return}; if(!Array.isArray(q)){q=[q]};
z=r.func.apply(this,q);
};
return z;
}}[`_fake_${k}`];
bake(f,'name',`_fake_${k}`); bake((h?bore(MAIN,h):MAIN),n,f);
try{bore(MAIN,k).prototype=Object.create(this[k].func.prototype)}
catch(e){};
}.bind({});
jack() - 解释
- 它有2个参数，第一个作为字符串（用于
bore），第二个作为拦截器（函数）
- 前几个 cmets 解释了一下 ..“add”行只是将另一个拦截器添加到同一个引用中
-
jack 释放现有函数，将其收起，然后使用“interceptor-functions”重播参数
- 拦截器可以返回
undefined或一个值，如果没有返回值，则不调用原始函数
- 拦截器返回的第一个值用作参数来调用原始值，并将结果返回给调用者/调用者
-
fail(":(") 是故意的；如果您没有该功能，则会引发错误 - 仅当 jack() 失败时。
示例
让我们防止eval在控制台-或地址栏中被使用
jack("eval",function(a){if(stak(0)){return a}; alert("having fun?")});
可扩展性
如果您想要一种DRY-er 方式来与jack 进行交互，以下方法已经过测试并且效果很好：
const hijack = function(l,f)
{
if(Array.isArray(l)){l.forEach((i)=>{jack(i,f)});return};
};
现在你可以批量拦截了，像这样：
hijack(['eval','XMLHttpRequest.prototype.open'],function()
{if(stak(0)){return ([].slice.call(arguments))}; alert("gotcha!")});
然后，聪明的攻击者可能会使用 Elements（开发工具）来修改某个元素的属性，给它一些 onclick 事件，然后我们的拦截器就赢了不明白；但是，我们可以使用mutation-observer 并使用该间谍来查看“属性更改”。在属性更改（或新节点）时，我们可以使用stak() 检查是否进行了更改FUBU：
const watchDog=(new MutationObserver(function(l)
{
if(!stak(0)){alert("you again! :D");return};
}));
watchDog.observe(document.documentElement,{childList:true,subtree:true,attributes:true});
结论
这些只是处理坏问题的几种方法；虽然我希望有人觉得这很有用，但请随时编辑此答案，或发布更多（或替代/更好）提高前端安全性的方法。