如何基于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 相关文章推荐
javascript eval函数深入认识
Feb 21 Javascript
javascript中使用replaceAll()函数实现字符替换的方法
Dec 25 Javascript
js日期时间补零的小例子
Mar 05 Javascript
jquery中的工具使用方法$.isFunction, $.isArray(), $.isWindow()
Aug 09 Javascript
浅析JS原型继承与类的继承
Apr 07 Javascript
需要牢记的JavaScript基础知识
Sep 25 Javascript
node.js与C语言 实现遍历文件夹下最大的文件,并输出路径,大小
Jan 20 Javascript
js实现4个方向滚动的球
Mar 06 Javascript
详解vuex结合localstorage动态监听storage的变化
May 03 Javascript
jQuery+Datatables实现表格批量删除功能【推荐】
Oct 24 jQuery
小程序接入腾讯位置服务的详细流程
Mar 03 Javascript
JS实现iframe中子父页面跨域通讯的方法分析
Mar 10 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
动态加载js的几种方法
2006/10/23 Javascript
JavaScript实现的日期控件具体代码
2013/11/18 Javascript
浮动的div自适应居中显示的js代码
2013/12/23 Javascript
js中同步与异步处理的方法和区别总结
2013/12/25 Javascript
javascript中取前n天日期的两种方法分享
2014/01/26 Javascript
Eclipse去除js(JavaScript)验证错误
2014/02/11 Javascript
jQuery根据用户电脑是mac还是pc加载对应样式的方法
2015/06/26 Javascript
js阻止移动端页面滚动的两种方法
2017/01/25 Javascript
Vue中正确使用jQuery的方法
2017/10/30 jQuery
WebSocket的通信过程与实现方法详解
2018/04/29 Javascript
微信小程序实现点赞、取消点赞功能
2018/11/02 Javascript
基于js判断浏览器是否支持webGL
2020/04/18 Javascript
JS脚本实现定时到网站上签到/签退功能
2020/04/22 Javascript
VUE项目axios请求头更改Content-Type操作
2020/07/24 Javascript
Openlayers实现地图全屏显示
2020/09/28 Javascript
基于Python_脚本CGI、特点、应用、开发环境(详解)
2017/05/23 Python
在Python中使用AOP实现Redis缓存示例
2017/07/11 Python
Python日期的加减等操作的示例
2017/08/15 Python
Pyqt实现无边框窗口拖动以及窗口大小改变
2018/04/19 Python
对python调用RPC接口的实例详解
2019/01/03 Python
Pycharm以root权限运行脚本的方法
2019/01/19 Python
使用 Python 玩转 GitHub 的贡献板(推荐)
2019/04/04 Python
如何使用Flask-Migrate拓展数据库表结构
2019/07/24 Python
解决Django后台ManyToManyField显示成Object的问题
2019/08/09 Python
Python验证码截取识别代码实例
2020/05/16 Python
利用 CSS3 实现的无缝轮播功能代码
2017/09/25 HTML / CSS
匈牙利最大的健身制造商和销售商:inSPORTline
2018/10/30 全球购物
武汉世纪畅想数字传播有限公司 .NET笔试题
2015/06/13 面试题
公务员培训心得体会
2013/12/28 职场文书
部队领导证婚词
2014/01/12 职场文书
建筑系毕业生自我鉴定
2014/01/24 职场文书
餐厅筹备计划书
2014/04/25 职场文书
信用社竞聘演讲稿
2014/05/16 职场文书
联谊活动总结
2014/08/28 职场文书
2014年勤工助学工作总结
2014/11/24 职场文书
学校三八妇女节活动总结
2015/02/06 职场文书