能否将Fetch API用作请求拦截器？

Question

我希望在使用Fetch API向服务器发送请求后运行一些简单的JS函数。我已经搜索了这个问题的答案，但是没有找到，可能是因为Fetch API相对较新。

之前我是通过XMLHttpRequest来实现的：

(function () {
   var origOpen = XMLHttpRequest.prototype.open;
   XMLHttpRequest.prototype.open = function () {
      this.addEventListener('load', function () {

         someFunctionToDoSomething();   

       });
       origOpen.apply(this, arguments);
    };
})();

希望知道是否有使用Fetch API实现相同全局功能的方法。

- Roger B. H.

Answer 1

由于fetch返回一个promise，你可以通过覆盖fetch来插入自己在promise链中:

由于fetch返回一个promise，您可以通过覆盖fetch来将自己插入到promise链中。

(function () {
    var originalFetch = fetch;
    fetch = function() {
        return originalFetch.apply(this, arguments).then(function(data) {
            someFunctionToDoSomething();
            return data;
        });
    };
})();

jsFiddle上的示例 (因为Stack Snippets没有方便的ajax功能)

- T.J. Crowder

Answer 2

就像你可以覆盖open方法一样，你也可以用一个拦截器来覆盖全局的fetch方法：

fetch = (function (origFetch) {
    return function myFetch(req) {
        var result = origFetch.apply(this, arguments);
        result.then(someFunctionToDoSomething);
        return result; // or return the result of the `then` call
    };
})(fetch);

- Bergi