fetch中断请求, 和再次恢复使用

业务场景:当时用fetch()建立长连接请求,在不使用时需要将其断掉,以缓解带宽压力和浏览器运行压力。等再次需要建立长链接时,再次启用。

1、外层定义controller;一旦中止,AbortController就会被消耗。每次调用都必须创建新的实例。
2、方法体内定义具体实现
const signal = controller.signal;
controller = new AbortController();
3、终端调用 controller.abort();

  // 判断某条件,如果不等于空, 先将fetch请求中断, 再在window上new AbortController()

这里为啥要用window呢?  因为我将中断操作,和建立链接操作放在了一个函数内.

  srtGet() {
      if (this.value != "") {
        window.controller.abort();
        console.log("signal 的中止状态: ", signal);
      }
      window.controller = new AbortController();
      let signal = window.controller.signal;
      console.log("signal 的初始状态: ", signal);
     
      fetch("/api/config/interface", {
        signal,
        method: "POST",
        headers: {
          "Content-Type": "application/json",
        },
        body: JSON.stringify(data),
      })
        .then((r) => )
        .then(f);
    },

你可能感兴趣的:(javascript,前端,开发语言)