使用 jQuery 捕获 XHR？

Question

我将 PhantomJS 与 jQuery 结合使用，我想知道是否可以在 XMLHttpRequest 传递到浏览器时捕获它，而无需自己启动 POST/GET。

Answer 1

有一些简单的 jQuery 函数可以让您在发送 AJAX 请求之前对其进行修改，但它们仅针对由 jQuery 发起的 AJAX 请求。要捕获页面上的所有 AJAX 请求，请使用以下基本的纯 JS 方法：

(function(open){
    XMLHttpRequest.prototype.open = function(method, url, async, username, password) {
        // modify the variables here as needed or use 'this` keyword to change the XHR object or add event listeners to it
        open.call(this, method, url, async, username, password);
    };
})(XMLHttpRequest.prototype.open);

您还可以重写 XHR send() 函数：

(function(send){
    XMLHttpRequest.prototype.send = function(body) {
       // your code
       send.call(this, body);
    };
})(XMLHttpRequest.prototype.send);

基本上，此代码需要是页面上运行的第一个代码。所有后续的 XHR 请求都将通过重写的函数，允许您更改任何参数等。

注意：如果您希望针对某些版本的 IE，则需要为 IE 用于 AJAX 的 ActiveXObject 实现类似的代码。

Answer 2

ajaxPrefilter 听起来不错，但从未使用过它。这会在发送到服务器之前过滤请求。然后，当请求返回时，您可以使用 pipe 修改您想要的内容：

$.ajaxPrefilter(function(options, originalOptions, jqXHR){
    jqXHR.pipe(function(data){
        //modify the data the way you want
    })
});

Answer 3

对于页面发出的所有 XHR/AJAX 请求，都会调用 Phantom 的 onResourceReceived 回调。实际上两次，一次使用 stage="start"，一次使用 stage="end"。它不会为您提供内容，但会捕获 URL。