Question

我已经尝试了一段时间，以拦截提取请求。我已成功拦截了该呼叫，但原始呼叫未执行。直到昨天我才知道是什么东西，那是漫长的征途，只是弄清楚我听不懂$ .ajaxSuccess或XMLHttpRequest。

我在做什么错？我真的不知道诺言如何很好地运作。我已经尝试过阅读。

问题是，我这样做的方式可以成功读取返回的JSON，但不会将其传递给原始调用方函数。（仅供参考，我想在调用者函数执行之后处理数据）。这是我到目前为止所掌握的，并且不知道如何使其起作用：

const constantMock = window.fetch;
window.fetch = function() {
   return new Promise((resolve, reject) => {
      constantMock.apply(this, arguments)
         .then((response) => {
            resolve(response);
            if(response.url.indexOf("/history") === -1 || response.type == "cors")
               return;

            response.json().then((data) => {
               resolve(data);
               console.log(data);
            });
         })
         .catch((error) => {
            reject(response);
         })
   });
}

我该如何进行这项工作？我在做什么错，应该怎么做？

（在将代码注入浏览器时，我无权访问调用程序功能。）

Answer 1

我前一段时间做过类似的事情，这是我编写的模块。

注意：

resp.clone()在拦截时非常重要。响应是一次性使用的，因此克隆使您可以使用响应并将其也返回到原始回调。
恕我直言，返回原始的诺言链以及拦截器.then会更容易，当然，请确保在克隆.then出于您自己的目的后返回原始的响应。

无论如何，这是代码：

const fetchSnoop = (callback) => {
  if (typeof window.fetch.qwerCb !== 'undefined')
    window.fetch.qwerCb = callback;
  else {
    var qfetch = window.fetch;
    window.fetch = function (req, init) {
      return qfetch.apply(window, arguments).then(function (resp) {
        if (typeof window.fetch.qwerCb === 'function')
          window.fetch.qwerCb(resp.clone(), req, init);
        return resp;
      });
    };
    window.fetch.qwerCb = callback;
  }
};

我敢肯定，该模块旨在让您注册一个“回调”函数，以便在每次提取时调用该函数。它只能以我编写它的方式进行单个回调，但是如果需要多个回调，将我的单个具名属性更改为数组将非常容易。无论如何，这是注册回调的示例：

fetchSnoop((resp, req, init) => {
  if (true /* test criteria if you're only looking for particular fetches */)
    resp.json().then(t => {
      console.log('my json', t);
    });
});

拦截提取呼叫

1 个答案: