写了个chrome插件：拦截ajax请求并修改返回结果！

用空闲时间搞了这个插件，能够拦截页面上的 ajax 请求，并把返回结果替换成任意文本。它对 mock数据、排查一些线上问题等会有很大帮助。（固然 chales 等抓包软件也能够作到，然而使用起来比较繁琐，作成 chrome 插件的形式会方便许多）

如下是使用效果，用掘金这个网站示例。经过修改 ajax 请求结果，我把第一条文章标题替换成了“这标题特调皮（Σ（ﾟдﾟlll）句内三押×2）”：

（不瞒大家说，其实我是个rapper σ`∀´)σ  （不

使用示例（视频）

https://weibo.com/tv/v/HlVZD8cR9?fid=1034:4352275389595232

Chrome 商店地址

地址：chrome.google.com/webstore/de…

你也能够直接搜索 Ajax Interceptor 进行安装

注意

1. 建议第一次安装完重启浏览器，或者刷新你须要使用的页面。
   
2. 当你不须要使用该插件时，建议把开关关上（插件icon变为灰色），以避免对页面正常浏览形成影响。

3. 该插件只会在JS层面上对返回结果进行修改，即只会修改全局的XMLHTTPRequest对象和fetch方法里的返回值，进而影响页面展示。而你在chrome的devtools的network里看到的请求返回结果不会有任何变化。

大体原理

页面加载时往页面上注入 js 代码，这段 js 会生成一个 XMLHttpRequest 的代理对象，并把 window.XMLHttpRequest 替换成这个对象。该对象又会对 onreadystatechange 和 onload 两个回调函数作特殊处理，在它们执行时把 responseText 和 response 的值覆盖为你设置的值。
其它就是这段页面上的 js 代码和右侧弹出的 iframe (用户界面)以及插件后台代码的一些数据交互和存储上的实现，这部分比较杂就不介绍了~ 

0.4版本开始也支持修改fetch发起的请求了，稍微复杂一些，感兴趣的能够看一下源码。

源码在这里：github.com/YGYOOO/ajax…

核心代码在这个文件里：github.com/YGYOOO/ajax…

更新：

0.4版本：

fetch发起的请求也支持了。

0.3版本：

主要新增了 JSON 编辑功能，编辑 JSON 数据方便了不少~示例以下：

本人不按期写点可能有养分的文章，欢迎关注 σ`∀´)σ