javascript - 重试时编辑查询字符串参数

Question

我有以下代码结构：

$.ajax({
  type:"GET",
  url:"http://example.com",
  data:{
    final:false
  },
  retry: {
    attempt: 1,
    limit: 3,
    delay: 2000
  },
  success((data) => {
    console.log("yay!");
  }),
  error((error) => {
    if (this.retry.attempt++ <= this.retry.limit) {
      var self = this;
      if (self.retry.attempt > self.retry.limit) {
        self.data.final = true;
      }
      setTimeout(() => {$.ajax(self)}, this.retry.delay);
    }
  })
});

问题是，当第一次调用请求时，data参数被删除，其值作为查询字符串附加到 url。所以data已经不存在了。传递给重试调用的对象是：

{
  type:"GET",
  url:"http://example.com?final=false",
  retry: {
    attempt: 2,
    limit: 3,
    delay: 2000
  },
  success((data) => {
    //...
  }),
  error((error) => {
    //...
  }
}

如何编辑final最后一次重试请求的参数？

标签： javascriptjqueryajax

Answer 1

尝试在ajax通话之外定义您的请求：

const request = {
  type:"GET",
  url:"http://example.com",
  data:{
    final:false
  }
};

$.ajax({...request, ...{
  retry: {
    attempt: 1,
    limit: 3,
    delay: 2000
  },
  success((data) => {
    console.log("yay!");
  }),
  error((error) => {
    if (this.retry.attempt++ <= this.retry.limit) {
      const retryRequest = {...request, ...this};
      if (this.retry.attempt > this.retry.limit) {
        retryRequest.data.final = true;
      }
      setTimeout(() => {$.ajax(retryRequest)}, this.retry.delay);
    }
  })
});

或者，如果您只处理一个只需要在最后一次尝试时设置的标志：

$.ajax({
  type:"GET",
  url:"http://example.com",
  retry: {
    attempt: 1,
    limit: 3,
    delay: 2000
  },
  success((data) => {
    console.log("yay!");
  }),
  error((error) => {
    if (this.retry.attempt++ <= this.retry.limit) {
      var self = this;
      if (self.retry.attempt > self.retry.limit) {
        self.data = {final: true};
      }
      setTimeout(() => {$.ajax(self)}, this.retry.delay);
    }
  })
});

此外，胖箭头函数没有本地上下文，因此您的error函数不需要使用self，即这将起作用：

error((error) => {
  if (this.retry.attempt++ <= this.retry.limit) {
    if (this.retry.attempt > this.retry.limit) {
      this.data = {final: true};
    }
    setTimeout(() => {$.ajax(this)}, this.retry.delay);
  }
})