如何监听所有获取API调用？

Question

我们可以修改XMLHttpRequest.prototype.open以劫持所有Ajax请求。如果切换到新浏览器的fetch API，等价是什么？

const originalRequestOpen = XMLHttpRequest.prototype.open;
XMLHttpRequest.prototype.open = function() {
  this.addEventListener('load', function() {
      // do something
  });
  originalRequestOpen.apply(this, arguments);
};

Answer 1

我不建议修改原生对象和功能（甚至是对XMLHttpRequest.prototype.open的处理方式）。但您可以替换fetch函数itselt。最后它只是一个功能。

＆＃13;

＆＃13;

(function(ns, fetch){
	if(typeof fetch !== 'function') return;
  
  ns.fetch = function() {
  	var out = fetch.apply(this, arguments);
    out.then(({ok}) => console.log('loaded', ok) )
    
    return out;
  }
  
}(window, window.fetch))

fetch('https://jsonplaceholder.typicode.com/users')
fetch('https://jsonplaceholder.typicode.com/userz')

＆＃13;

＆＃13;

＆＃13;