基于fiddler自测js注入脚本

使用场景

因为注入脚本往往依赖客户端提供的桥，前端在控制台无法自测完整流程，需要客户端配合，效率较低。
以下利用fiddler作为代理，在手机连上代理之后，抓取手机上发出的请求，自动修改获取html文件的请求的返回结果，把替换为，再返回给手机，这就完成了脚本注入。

一、安装fiddler

1.安装和配置，详见：https://blog.csdn.net/ychgyyn/article/details/82154433
2.如果安装后无法打开fiddler，提示错误代码0x800F081F，这是因为windows update这个服务被关闭了，导致无法安装.net framework 3.5，而使用fiddler需要先安装.net framework 3.5。windows update服务打开步骤详见：https://jingyan.baidu.com/article/bad08e1ed21dd709c851211a.html
3.熟悉fiddler的使用，详见：https://www.cnblogs.com/yyhh/p/5140852.html

二、搭建本地服务器

方法众多，以下采用一种最适合前端同学的方式：

1. 全局安装http-server：

npm install http-server -g

2. 进入目标文件夹，然后在终端输入：

http-server -c-1

出现：

Starting up http-server, serving ./
Available on:
  http://172.24.0.23:8080
  http://127.0.0.1:8080
Hit CTRL-C to stop the server

即可通过以上URL访问本机位于目标文件夹下的文件。

三、在页面中自动注入js

菜单栏Rules→Customize Rules…，打开Fiddler ScriptEditor，找到OnBeforeResponse方法，在里面加入以下代码并保存：

if (oSession.oResponse.headers.ExistsAndContains("Content-Type","text/html")){
  oSession.utilDecodeResponse();
  oSession.utilReplaceInResponse('</body>','<script src="http://172.24.0.23:8080/inject.min.js"></script></body>');
}

即在把请求结果返回给客户端之前，对于html文件，修改内容引入我们的注入脚本。
如果要指定页面，可以在if中增加判断oSession.HostnameIs(“”)||oSession.uriContains(“”)，详见：https://www.zhaokeli.com/article/8100.html#mulu1
至此，所有准备工作都已完成。在app中打开h5页，查看注入脚本执行效果。