wendux / ajax-hook

Intercepting browser's http requests which made by XMLHttpRequest.

It's wendux(杜文).

About me:

• 👨‍💻 Front-end development expert. Focus on Web、Flutter and other Cross-platform techs.
• 👯 Creator of Flutter China org and maintainer of China Flutter User Group (CFUG).
• 🌎 Creator of dio.
• 📚 Author of 《Flutter实战》.
• 💻 Work in Bytedance since 2018. Baidu in 2014, XYF in 2017.

Contact me:

• ✉️ Personal: [email protected]、[email protected].
• 🌐️ Twitter：https://twitter.com/duwen65952787.

ajax-hook's Issues

并不是所有的请求都能拦截到？

【BUG】属性拦截无效

                //If the attribute isn't writable, generate proxy attribute
                var attrSetterHook = (hook || {})["setter"];
                v = attrSetterHook && attrSetterHook(v, that) || v
                try {
                    xhr[attr] = v;
                } catch (e) {
                    this[attr + "_"] = v;
                }

这里有严重的BUG。
1.非严格模式下,是没有异常抛出的。
2.很多属性是访问器属性,只不过set方法是undefined。比如response，responseText，最新版本做不到拦截这类属性。

方法的HOOK，为什么在方法代理的时候不把返回值也返回呢

现在：
function hookFunction(fun) {
return function () {
var args = [].slice.call(arguments);
if (proxy[fun] && proxy[fun].call(this, args, this.xhr)) {
return;
}
return this.xhr[fun].apply(this.xhr, args);
};
}

期望：
function hookFunction(fun) {
return function () {
var args = [].slice.call(arguments);
if (proxy[fun]) {
return proxy[fun].call(this, args, this.xhr);
}
return this.xhr[fun].apply(this.xhr, args);
};
}

怎样可以在拦截的时候往headers里边添加参数或post的data里添加数据

我在open方法中试了会报错。

如何在 onRequest中进行网络请求？

在onRequest想进行同步网络请求。
发现用jquery $.ajax无法发送请求

建议在Object.defineProperty中添加enumerable: true来支持枚举

我想在调用send时把所有的回调事件存起来，但是Object.defineProperty的枚举值默认是false，所以建议能像原生的xhr实例一样支持枚举。

hookAjax({
  send(arg, xhr) {
    for(let key in this) {
      if(/^on/.test(key)) {
        //do something
      }
    }
  }
})

Anyway to hook the requests generated by iframes?

浏览器支持情况怎么样？

请问浏览器支持情况怎么样？

ajax同步请求拦截

请问怎么拦截同步的请求呢，因为同步请求不会触发onreadystatechange。

new FormData ajax 好像拦截不到? 有点懵逼

new FormData ajax 好像拦截不到? 有点懵逼

美团外卖做了防Hook。

Uncaught RangeError: Maximum call stack size exceeded

代码位置：
function o(t) {
function e(e) {
return function() {//这里会报递归调用
var r = this.hasOwnProperty(e + "") ? this[e + ""] : this.xhr[e],
n = (t[e] || {}).getter;
return n && n(r, this) || r
}
}

想知道该如何解决？

IE 兼容性问题

其他浏览器没有问题，IE碰到了个奇怪的问题

“Inspector returns the error: Object doesn't support this action”

Debug后发现是xor-proxy.js 文件 triggerListenner方法最后的getEventType(xhr).dispatchEvent抛出的异常

参考这个问题 https://stackoverflow.com/questions/27176983/dispatchevent-not-working-in-ie11

修改成

var evt;
if(typeof(Event) === 'function') {
    evt = new Event(name);
} else {
    evt = document.createEvent('Event');
    evt.initEvent(name, false, true);
}
getEventTarget(xhr).dispatchEvent(evt);

解决了这个IE兼容性问题，

要是作者有时间的话可以拿IE试一下。

onload无法拦截,并且会导致xhr.onload 无法被调用

加上

Object.defineProperty (XMLHttpRequest.prototype , 'onload' , {
            get : getFactory ("onload") ,
            set : setFactory ("onload") ,
            enumerable : true
        })

后正常

请教：拦截jsonp请求

楼主这个东西很好用，在之前的项目中用上了：）

现在的需求是要拦截jsonp请求，楼主的这个就用不上了，想了半天没好办法，所以特来请教下，不知有什么思路吗？

微信273537001联系麻烦

能做到拦截重定向吗？

我有个需求是获取重定向地址，并不是想做页面跳转。

timeout问题

hookAjax({
            ontimeout: function(){
                console.log('timeout');
            }
        })
        $.ajax({
            url: '任意接口',
            timeout: 1000,
        })

将浏览器调到慢网 是不是应该预期显示timeout？目前没有显示

谷歌翻译 出错

使用谷歌翻译的时候出错

如何捕获error

如题，如果网络断开了，这个时候原生可以监听到error事件，那么这里该如何处理？

好用的库，拦截hack网站很适合，很愉快

web开发环境 监听 hooks获取不到请求headers

http://192.168.100.31:3900/sockjs-node/info?t=1592310883411
xhr-proxy.js 70

xhr.resHeader = response.headers;=> xhr.resHeader = response.headers||{};
就可以了

jsonp 的不支持？

RT

如何在send阶段获取url

hook以后相对数据进行加密，但是加密需要根据不同的url来判断。怎么在send阶段拿到url呢？

Object.defineProperty responseText在android 5.1 oppo 中无效，导致异步请求无法获取数据

系统

手机名称：OPPO A59S
colorOs:v 3.0
Android:5.1

表现

无法获取请求返回数据，

原因

通过Object.defineProperty设置的属性response, responseText 不生效，需要显示的
在onreadystatechange 中手动设置
在https://github.com/wendux/Ajax-hook/blob/master/src/ajaxhook.js#L48
之前添加

if (attr === 'onreadystatechange') {                   
    that.responseText = that.xhr.responseText;
    that.response = that.xhr.response;
}

What kind of license does the project have?

I want to use this solution in my project but I can not find information about license on use.

iframe的请求hook问题

请问下这个库是否支持hook到同一个页面，内嵌iframe子页面的所有xmlHttpRequest请求呢？谢谢

getEventTarget 这个函数在IE9-10,edge都报错

这个函数主要用来做什么的

使用之后同步请求不在同步

使用proxy进行拦截以后，发现之前设置的同步请求在会同步执行了，看起来更像是异步执行，取消掉proxy能够正常执行，但是加上这个就像异步执行了。

另外设置config.withCredentials=true 好像无效， 通过设置config.xhr.withCredentials=true 才能生效，不知道是我用法不对还是有bug

onabort问题

hookAjax({
onabort: function(){
                console.log('abort');
            }
})
 $.ajax({
            url: '任意接口',
            timeout: 1000
        })

慢网下触发onabort 同时报错：

ajax 异步通过formdata上传文件异常

事先声明我是个后端,如果有理解不到位的,请见谅,建议增加try catch,执行时,ajaxhook总容易出现异常

发送前添加header要怎么处理

对xmlhttprequest不太熟悉

请教一下，这个库适合注入到webview中吗？比如wkwebview

有时候导致页面本身的某些请求失败

比如post请求失败

可以不走网络请求，直接返回数据吗，用来开发期间模拟接口

不走网络请求，直接返回数据，我将send方法里return true，但不知道如何将模拟的响应数据传给xhr

如果访问异常或者超时 应该如何监控?

如果访问异常或者超时 应该如何监控?

请教一下怎么做到，截获send()，然后修改send里的数据后再重新发出去，我不太懂前端

Access to request FormData

Hi
Is it possible to get read access to the request body when using POST/PUT request with the request url?
The xhr object does not contain this data
Closest I got to is:

ah.hookAjax({
    send:function(arg,xhr){
         console.log("send args = %s", arg.join()); //body, but no url
    },
    onreadystatechange:function(xhr){
        console.log("responseURL: %s", xhr.responseURL); //url, but no request body
});

Is there a way to get both request-body and request-url in same context?

Thanks!

在onreadystatechange函数里打印readyState未出现过 1 的状态

想在readyState为1（open方法已经被调用，但还没调用send方法）时调用setRequestHeader方法设置header，但在onreadystatechange里打印readyState，从未出现过为1的状态，想请教下是什么原因，谢谢。

代码如下：

以下是在控制台打印的结果：

支持拦截fetch吗？

getterFactory 的获取 getter 属性什么时候会有值？

我猜测这里是要获取属性的 getter 方法，但是直接这么获取应该是拿不到的，应该永远都是 undefined 。不解， 求大神解释

JQuery ajaxTransport 使用异步会把 onload 和 change 吃掉怎么办

JQuery ajaxTransport 使用异步会把 onload 和 change 吃掉

那么 onload 或者 onreadystatechange没法抓了，只能抓到 open 和 send

支持ie8吗

在ie8下不支持default属性，加载js有问题，这个可以解决吗

建议添加 Object.keys(XMLHttpRequest)

(function() {
	for (var p in window._ahrealxhr) {
		Object.defineProperty(XMLHttpRequest, p, {
			get: function() {
				return window._ahrealxhr[p]
			},
			set: function() {}
		})
	}

})()

更贴近XMLRequest

1.x版本的代码哪里能找到啊？

老的链接直接重定向到2.0版本了，想要1.x版本的链接。。。

onreadystatechange拦截会出现response为空，取不到response

总是提示跨域错误

code

ah.proxy({
  //请求成功后进入
  onResponse: (response, handler) => {
    console.log("ceshi-----")
    console.log(response)
    if (response.config.url.startsWith('https://zhihu-web-analytics.zhihu.com/api/v1')) {
      console.log("88888")
      axios.post('http://localhost/receiver/movie', {
        url: window.location.href,
        data: response.response
      }, {
        headers: {
          'Content-Type': 'application/json'
        }
      })
      console.log(response.response)
      console.log(typeof response)
      console.log(response)
      handler.next(response)
    }
  }
})

console error

Uncaught TypeError: Cannot read property 'apply' of null

Uncaught TypeError: Cannot read property 'apply' of null

用了这个就不能抓包了吧

scenario

scenario is ？

timeout设置无效

timeout属性设置后会被代理成timeout_属性，虽然有对timeout做get劫持，但是貌似xhr内部在处理超时的时候并没有取timeout_这个属性，而是仍然取得是timeout属性，导致属性失效，估计设置withCredential也会出现同样的问题。