公用 JS 拦截所有请求并处理的方法

在前端开发中，有时候我们需要对所有的网络请求进行统一的处理，比如添加请求头、处理错误、记录日志等。这时候，使用公用的JavaScript代码来拦截所有请求并进行处理就是一个很好的解决方案。

我们可以利用XMLHttpRequest对象来实现请求拦截。XMLHttpRequest是浏览器提供的用于发送HTTP请求的对象，我们可以通过重写它的open方法来拦截请求。具体做法是先保存原始的open方法，然后定义一个新的open方法，在新方法中添加我们的处理逻辑，最后再调用原始的open方法。

例如，以下是一个简单的示例代码：

(function() {
  var originalOpen = XMLHttpRequest.prototype.open;
  XMLHttpRequest.prototype.open = function(method, url, async, user, password) {
    // 在这里添加处理逻辑，比如添加请求头
    this.setRequestHeader('Custom-Header', 'Value');
    originalOpen.apply(this, arguments);
  };
})();

除了XMLHttpRequest，现代浏览器还支持Fetch API，我们也可以对其进行拦截。对于Fetch API，我们可以通过重写window.fetch方法来实现。同样，先保存原始的fetch方法，然后定义一个新的fetch方法，在新方法中进行处理后再调用原始的fetch方法。

示例代码如下：

const originalFetch = window.fetch;
window.fetch = function(url, options) {
  // 添加处理逻辑，比如记录请求信息
  console.log('Request URL:', url);
  return originalFetch(url, options);
};

在实际应用中，我们还可以在拦截代码中处理请求错误。比如，当请求返回状态码不是200时，我们可以统一进行错误提示或者进行其他的错误处理操作。

另外，为了避免与其他代码冲突，我们可以将拦截代码封装在一个独立的模块中，在需要的地方引入并使用。

通过上述方法，我们可以方便地实现公用的JavaScript代码来拦截所有请求并进行处理。这样可以提高代码的可维护性和复用性，同时也方便我们对网络请求进行统一的管理和控制。