请求取消
uniapp 中request可撤销
// 发送请求,并保存 requestTask 对象
let requestTask = uni.request({
url: 'https://example.com/api/data',
success: (res) => {
console.log('请求成功:', res);
},
fail: (err) => {
console.log('请求失败:', err);
}
});
// 在需要取消请求的地方调用 abort()
requestTask.abort();
取消后会调用fail回调函数
公共方法返回 requestTask 对象
// utils/request.js
export function publicRequest(options) {
// 发送请求并返回 requestTask 对象
const requestTask = uni.request({
url: options.url,
method: options.method || 'GET',
data: options.data,
success: options.success,
fail: options.fail
});
// 返回 requestTask,供外部取消
return requestTask;
}
调用
import { publicRequest } from '@/utils/request.js';
export default {
data() {
return {
requestTask: null
};
},
methods: {
// 发送请求
sendRequest() {
this.requestTask = publicRequest({
url: 'https://example.com/api/data',
success: (res) => { console.log('成功:', res); },
fail: (err) => { console.log('失败:', err); }
});
},
// 取消请求
cancelRequest() {
if (this.requestTask) {
this.requestTask.abort();
this.requestTask = null;
}
}
}
};
全局维护请求任务列表
// utils/request.js
const requestTasks = new Map(); // 全局请求任务池
export function publicRequest(options) {
// 生成唯一标识(示例:URL + 参数序列化)
const requestKey = `${options.url}_${JSON.stringify(options.data)}`;
// 如果已有相同请求,先取消旧请求
if (requestTasks.has(requestKey)) {
requestTasks.get(requestKey).abort();
requestTasks.delete(requestKey);
}
// 发送新请求
const requestTask = uni.request({
url: options.url,
method: options.method || 'GET',
data: options.data,
success: (res) => {
options.success?.(res);
requestTasks.delete(requestKey); // 请求完成后移除任务
},
fail: (err) => {
options.fail?.(err);
requestTasks.delete(requestKey); // 失败后也移除任务
}
});
// 记录当前请求任务
requestTasks.set(requestKey, requestTask);
return requestTask;
}
export function cancelRequest(requestKey) {
if (requestKey) {
if (requestTasks.has(requestKey)) {
requestTasks.get(requestKey).abort();
requestTasks.delete(requestKey);
}
} else {
// 取消所有请求
requestTasks.forEach(task => task.abort());
requestTasks.clear();
}
}