如何基于JS截获动态代码


Posted in Javascript onDecember 25, 2019

这篇文章主要介绍了JS注入eval, Function系统函数并截获动态代码,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下

正文

现在很多网站都上了各种前端反爬手段,无论手段如何,最重要的是要把包含反爬手段的前端javascript代码加密隐藏起来,然后在运行时实时解密动态执行。

动态执行js代码无非两种方法,即eval和Function。那么,不管网站加密代码写的多牛,我们只要将这两个方法hook住,即可获取到解密后的可执行js代码。

注意,有些网站会检测eval和Function这两个方法是否原生,因此需要一些小花招来忽悠过去。

挂钩代码

首先是eval的挂钩代码:

(function() {
  if (window.__cr_eval) return
  window.__cr_eval = window.eval
  var myeval = function (src) {
    console.log("================ eval begin: length=" + src.length + ",caller=" + (myeval.caller && myeval.caller.name) + " ===============")
    console.log(src);
    console.log("================ eval end ================")
    return window.__cr_eval(src)
  }
  var _myeval = myeval.bind(null) // 注意:这句和下一句就是小花招本招了!
  _myeval.toString = window.__cr_eval.toString
  Object.defineProperty(window, 'eval', { value: _myeval })
  console.log(">>>>>>>>>>>>>> eval injected: " + document.location + " <<<<<<<<<<<<<<<<<<<")
})();

这段代码执行后,之后所有的eval操作都会在控制台打印输出将要执行的js源码。

同理可以写出Function的挂钩代码:

(function() {
  if (window.__cr_fun) return
  window.__cr_fun = window.Function
  var myfun = function () {
    var args = Array.prototype.slice.call(arguments, 0, -1).join(","), src = arguments[arguments.length - 1]
    console.log("================ Function begin: args=" + args + ", length=" + src.length + ",caller=" + (myfun.caller && myfun.caller.name) + " ===============")
    console.log(src);
    console.log("================ Function end ================")
    return window.__cr_fun.apply(this, arguments)
  }
  myfun.toString = function() { return window.__cr_fun + "" } // 小花招
  Object.defineProperty(window, 'Function', { value: myfun })
  console.log(">>>>>>>>>>>>>> Function injected: " + document.location + " <<<<<<<<<<<<<<<<<<<")
})();

注意:和eval不同,Function是个有变长参数的构造方法,需要处理this

另外,有些网站还会用类似的机制加密页面内容,然后通过document.write输出动态解密的内容,因此同样可以挂钩document.write,挂钩方法类似eval,这里就不重复了。

注入方式

另外,还有个问题需要关注,就是挂钩代码的注入方法。

最简单的就是F12调出控制台,直接执行上面的代码,但这样只能hook住执行之后的eval调用,如果希望从页面刚加载时就注入,那么可以用以下几种方式:

  • 油猴注入,油猴可以监听文档加载的几种不同状态,并在特定时刻执行js代码。我没有太多研究,具体请参见油猴手册
  • 代理注入,修改应答数据,在<head>标签内的第一个位置插入<script>节点,确保在其它js加载执行前注入;Fiddler, anyproxy等都可以编写外部规则,具体请参见附录部分
  • 使用chrome-devtools-protocol, 通过Page.addScriptToEvaluateOnNewDocument注入外部js代码
  • 附录

不少人没用过代理规则,这里写一下Fiddler和anyproxy的规则编写方法:

1. 如何添加Fiddler代理规则

Fiddler菜单里Rules > Customize Rules 打开脚本编辑器

在脚本编辑器里找OnBeforeResponse方法,方法内添加下面C#代码:

if (oSession.oResponse.headers.ExistsAndContains("Content-Type", "html")){
  oSession.utilDecodeResponse(); // Remove any compression or chunking
  var b = System.Text.Encoding.UTF8.GetString(oSession.responseBodyBytes);
  var r = /<head[^>]*>/i;
  var js = "..."; // 要注入的js源码,见正文
  b = b.replace(r, "$0<script>" + js + "</script>");
  oSession.utilSetResponseBody(b); // Set the response body back
}

这样就会在所有html文档头部自动添加js代码了

2. 如何添加anyproxy代理规则

编辑一个rule.js保存在anyproxy根目录下,内容如下:

function injectEval() {
  if (window.__cr_eval) return
  ... // 见正文,此处略
  console.log(">>>>>>>>>>>>>> eval injected: " + document.location + " <<<<<<<<<<<<<<<<<<<")
}
module.exports = {
 summary: 'a rule to hook all eval',
 *beforeSendResponse(requestDetail, {response}) {
  if (response.header["Content-Type"].indexOf("text/html") >= 0) {
   response.body = (response.body + "").replace(/<head[^>]*>/i, `$&<script>(${injectEval})();</script>`)
   return {response}
  }
 },
};

带规则启动anyproxy

anyproxy -r rule.js

可以看到,使用基于js的工具链有其天然优势,即注入代码可以以源码而不是字符串形式和规则代码共存,这样可以利用到IDE的语法检查、自动完成等机制,能够大大提高生产力。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
一份老外写的XMLHttpRequest代码多浏览器支持兼容性
Jan 11 Javascript
利用jQuery操作对象数组的实现代码
Apr 27 Javascript
有关于eclipse配置spket需要注意的一些地方
Apr 07 Javascript
jQuery实现列表自动滚动循环滚动展示新闻
Aug 22 Javascript
Javascript模拟加速运动与减速运动代码分享
Dec 11 Javascript
JS常用字符串方法(推荐)
Jan 15 Javascript
js 获取元素所有兄弟节点的实现方法
Sep 06 Javascript
JavaScript页面实时显示当前时间实例代码
Oct 23 Javascript
angularJS开发注意事项
May 26 Javascript
原生JS实现的简单小钟表功能示例
Aug 30 Javascript
JavaScript多种滤镜算法实现代码实例
Dec 10 Javascript
es6 for循环中let和var区别详解
Jan 12 Javascript
通过微信公众平台获取公众号文章的方法示例
Dec 25 #Javascript
vue远程加载sfc组件思路详解
Dec 25 #Javascript
node实现mock-plugin中间件的方法
Dec 25 #Javascript
微信小程序停止其他视频播放当前视频的实例代码
Dec 25 #Javascript
vue分页插件的使用方法
Dec 25 #Javascript
继承行为在 ES5 与 ES6 中的区别详解
Dec 24 #Javascript
在JavaScript中实现链式调用的实现
Dec 24 #Javascript
You might like
关于zend studio 出现乱码问题的总结
2013/06/23 PHP
ThinkPHP之foreach标签使用概述
2014/06/30 PHP
基于PHP给大家讲解防刷票的一些技巧
2015/11/18 PHP
jQuery之过滤元素操作小结
2013/11/30 Javascript
js获取元素相对窗口位置的实现代码
2014/09/28 Javascript
Nginx上传文件全部缓存解决方案
2015/08/17 Javascript
JS基于VML技术实现的五角星礼花效果代码
2015/10/26 Javascript
Angular实现form自动布局
2016/01/28 Javascript
jQuery插件MovingBoxes实现左右滑动中间放大图片效果
2017/02/28 Javascript
史上最全JavaScript常用的简写技巧(推荐)
2017/08/17 Javascript
JS闭包的几种常见形式实例详解
2017/09/16 Javascript
详解在WebStorm中添加Vue.js单文件组件的高亮及语法支持
2017/10/21 Javascript
微信小程序tabBar模板用法实例分析【附demo源码下载】
2017/11/28 Javascript
JavaScript指定断点操作实例教程
2018/09/18 Javascript
浅谈vue项目打包优化策略
2018/09/29 Javascript
vue cli3.0结合echarts3.0与地图的使用方法示例
2019/03/26 Javascript
React学习之JSX与react事件实例分析
2020/01/06 Javascript
JavaScript浅层克隆与深度克隆示例详解
2020/09/01 Javascript
[01:32:50]DOTA2-DPC中国联赛 正赛 DLG vs XG BO3 第一场 1月25日
2021/03/11 DOTA
python字符串,数值计算
2016/10/05 Python
利用Python脚本生成sitemap.xml的实现方法
2017/01/31 Python
详解 Python中LEGB和闭包及装饰器
2017/08/03 Python
根据DataFrame某一列的值来选择具体的某一行方法
2018/07/03 Python
python 字符串只保留汉字的方法
2018/11/16 Python
python神经网络编程实现手写数字识别
2020/05/27 Python
公务员个人自我评价分享
2013/11/06 职场文书
销售主管岗位职责范本
2014/02/14 职场文书
财务总监岗位职责
2014/03/07 职场文书
财务管理专业求职信
2014/06/11 职场文书
数学教育专业求职信
2014/07/22 职场文书
乡镇创先争优活动总结
2014/08/28 职场文书
大学毕业生个人总结
2015/02/28 职场文书
该怎么书写道歉信?
2019/07/03 职场文书
pycharm 如何查看某一函数源码的快捷键
2021/05/12 Python
JavaScript实现简单计时器
2021/06/22 Javascript
Vue组件更新数据v-model不生效的解决
2022/04/02 Vue.js