axios中断接口请求操作

背景

今天做AI对话项目的时候，遇到了这个中断接口请求到操作需求，

遂记录一下，

第一步

在封装的axios接口函数中，添加config，类似：

export function askQuestion(data, config) {
  return request({
    url: '/api/ai/ask',
    method: 'post',
    data,
    ...config // Merge the config object here
  })
}

需要自己config参数，

第二步

在你调用接口的组件中，创建 AbortController 实例，并在接口函数中引入

{ signal: abortController.signal }

let abortController = new AbortController(); // 创建 AbortController 实例
const response = await askQuestion({
      context: nextContent,
      conversationId: activeKey.value // Use activeKey as conversationId
    }, { signal: abortController.signal });

第三步

在你按钮操作或者其他逻辑上调用：

abortController.abort();