ajax可以中断请求吗

Question

一个地方四个按钮，每个都会调一个接口(调的方法是同一个参数不一样而已)，有用户快速来回点的时候返回不及时会产生交互延迟的情况，有没有办法，重新调的时候结束上一次请求。或者有什么其他思路

function getTableData(status = 'wp') {
    $.ajax({
        url: "xxx",
        type: 'POST',
        data: status,
        dataType: 'json',
        contentType: "application/json;charset=UTF-8",
        success: function(data) {
            if(data){
               ...
            }else{
               ...
            }
        },
        error: function(data) {
            console.log(data)
        }
    })
}

Answer 1

// 缓存实例
var a = $.ajax({...})

// 中断ajax
a.abort()

Answer 2

这思路不太对吧，万一客户点击的时候，上一次请求已经发出去了，但是你给结束掉了，这样后台已经改变了状态，但是前台没有更新状态，就对不太上了吧。我觉得点击发请求的时候，就给个mask和loading，让用户无法再点其它按钮了，请求结束再放开，这样状态就比较统一了

Answer 3

中断是不现实的，
如果是轮询获取数据类型的接口，可以通过 webscoket 实现，
如果是业务处理类型的接口，建议控制按钮！

1.通过 loading 控制加载，可以通过 axios 配置拦截器
2.通过 locked 状态锁定当前页面的按钮，以及点击事件

Answer 4

可以使用axios里的 cancelToken 属性：

https://segmentfault.com/a/1190000023573863