萌新最近研究前端 js 有感，简单的分享一下，大佬们就看个乐呵就好。先说结论：补环境本质就是 hook 技术。

1、首先是补环境，最简单的像 ua 这种，由于浏览器环境和 node.js 环境不同，node.js 中没有（主要补的就是大伙都在说的dom和bom），因此直接这么处理就能过 navigator.userAgent 这样的检测，这就是最简单的补环境，原型链那些这里不展开细说，网上资料还是比较多的。

2、再简单聊聊 hook 最简单的 cookie 像下面这样：

3、在回过头想想 _$ 等给 document.cookie 设置值，如果采用的补环境，最终也是 node.js 中有个 document，然后设置一个属性 cookie。

再比如前端常用的 xhr 请求，我们可能会扩展一下这么做：

4、那么思路就来了，像 document.cookie 这种是给浏览器的 document 设置属性，在 node.js 中 document 只是我们自己在全局模拟的；我们hook到以后不再是 debugger 调试，而是进行全局的设置。对于 xhr 请求的 XMLHttpRequest 这种也是我们自己模拟的，只不过设置的东西是我们全局去定义另一个变量去接收。
所以这个补环境，其实本质上也可以理解为在 node.js 中实现 hook，除了 hook 属性，也可以 hook js 方法，最终实现的还是给全局某个变量设置我们需要的值即可。

对于代码执行过程：代码开始执行->生成需要的值->代码执行完毕。
结合上面的思路。对于我们需要的值，不管他代码执行多长，我们只需要补的环境范围是：代码开始执行->生成需要的值且能够被hook设置到全局。之后不管他代码如何执行，都已经没有意义，我们只需要让代码正常运行结束不会报错中断即可。也就是说，从：生成需要的值且能够被hook设置到全局->整个代码执行完毕 这一部分的环境，我们其实是不需要补的，我这里就简单称作半补环境。

5、适用场景：
（1）直接半补出来的值就是需要的结果。
（2）半补出来的值，还需要经过后面的算法处理，但是后面的算法已经轻松还原，且如果补环境比较复杂的情况。可以半补生成需要的值，hook 设置到全局返回，再通过另一个专门的算法进行传参调用拿到最终值。
（3）这点与全补环境一致，对于频繁更新算法的，补环境更具有通用性，且换到其他地方也可以使用这套环境，不行就继续补充需要的环境，到最后也是补环境框架的路。

6、目前个人碰到过，比如像 Number()，如下图：

再像数组Array，还有很多其余可以自行扩展摸索（不一定是 new Proxy 的方式，还有重写方法注入等 hook 方式），毕竟授之于渔。

那么如果是前端js，半补+hook 的方式真的无敌吗，目前感觉到的是比如像数组的 push 和 pop，以及算术运算，实现似乎有点难，像算术运算，还是 js 不够底层，没法像 python 这种一样：

7、综合上面来说，半补可能对补环境要求不是很高，因为需要补充的环境没那么多，但是需要：
（1）完全理清楚需要哪些代码片段（或文件）执行而来，而不是一股脑的全扒下来。
（2）对指定编程语言要求比较熟练（我这里说的是编程语言，而不再仅仅是js），不然无法写出一些深层次的hook代码。同时，对于拥有补环境框架的大佬们来说，这个思路也比较的鸡肋。

8、对抗思路：
（1）关键参数避免使用内置API。
（2）参数的生成过程所用到的所有内置 API，开发者重写增加自己的逻辑，避免被通用 hook 所捕获。
（3）增强参数生成的环境检测。
（4）在参数生成后的代码片段进行一些操作，让代码不正常执行没法正常结束运行，这样即使获得了正确的值也没法正常返回程序卡死。