js 终止异步请求

vue在spa模式下,当前页面正在切换路由的时候,如何终止正在发生的异步请求、或者其他场景需要你去关闭当前还在发送的请求。

解决方案:

把执行的请求存入队列,当路由切换的时候终止队列里的异步请求。

首先搞一棵树来存储请求队列


import Vue from "vue";
import Vuex from "vuex";
Vue.use(Vuex);
let store = new Vuex.Store({
  state: {
    requests: [],
  },
});

new Vue({
  el: "#app",
  router: router,
  render: (h) => h(App),
  store,
});

利用 ajax 请求和终止


var xhr = $.ajax({
  type: "POST",
  url: "xxxsx",
  data: "",
  success: function () {
    alert("ok");
  },
});
//xhr.abort()  终止请求
this.$store.state.requests.push(xhr);

利用 superagent 请求 和终止


const request = require('superagent')
var xhr = request('post','/api/xxxx/xxxx')
xhr.send(data)
//xhr.query(data) //get 传参
x

版权声明:本文为fzl_1996原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。