拦截ajax、src、href、表单等http请求

function hookAJAX() {
    XMLHttpRequest.prototype.nativeOpen = XMLHttpRequest.prototype.open;
    var customizeOpen = function (method, url, async, user, password) {
      // do something
      this.nativeOpen(method, url, async, user, password);
    };

    XMLHttpRequest.prototype.open = customizeOpen;
  }

  /**
   *全局拦截Image的图片请求添加token
   *
   */
  function hookImg() {
    const property = Object.getOwnPropertyDescriptor(Image.prototype, 'src');
    const nativeSet = property.set;

    function customiseSrcSet(url) {
      // do something
      nativeSet.call(this, url);
    }
    Object.defineProperty(Image.prototype, 'src', {
      set: customiseSrcSet,
    });
  }

  /**
   * 拦截全局open的url添加token
   *
   */
  function hookOpen() {
    const nativeOpen = window.open;
    window.open = function (url) {
      // do something
      nativeOpen.call(this, url);
    };
  }

  function hookFetch() {
    var fet = Object.getOwnPropertyDescriptor(window, 'fetch')
    Object.defineProperty(window, 'fetch', {
      value: function (a, b, c) {
        // do something
        return fet.value.apply(this, args)
      }
    })
  }
  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 6
    评论
拦截 AJAX 请求,你可以使用 XMLHttpRequest 对象的 onreadystatechange 事件,在该事件的回调函数中处理请求和响应数据。 以下是一个示例代码: ```javascript // 创建一个新的XMLHttpRequest对象 var xhr = new XMLHttpRequest(); // 重写XMLHttpRequest的open方法 var open = xhr.open; xhr.open = function(method, url, async) { // 在发送请求之前拦截请求,可以在这里修改URL或请求头等信息 console.log('intercept request:', method, url, async); // 调用原生的open方法 open.call(xhr, method, url, async); }; // 重写XMLHttpRequest的send方法 var send = xhr.send; xhr.send = function(data) { // 在发送请求之前拦截请求体,可以在这里修改请求体的数据格式等信息 console.log('intercept request body:', data); // 调用原生的send方法 send.call(xhr, data); }; // 监听XMLHttpRequest对象的onreadystatechange事件 xhr.onreadystatechange = function() { if (this.readyState == 4 && this.status == 200) { // 在接收到响应后拦截响应数据,可以在这里修改响应数据的格式等信息 console.log('intercept response:', this.responseText); } }; // 发送一个GET请求 xhr.open('GET', '/api/getData', true); xhr.send(); ``` 在上述示例代码中,我们通过重写 XMLHttpRequest 对象的 open 和 send 方法,拦截AJAX 请求,并在请求和响应的各个阶段打印了一些信息。你可以在这些拦截器中添加自己的逻辑,以实现更复杂的功能。
评论 6
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值