使用fetchEventSource内置api,而不是Ajax请求,响应类似于打字机一样,只能在浏览器上使用,小程序不支持;
一、下载 @microsoft/fetch-event-source
npm install @microsoft/fetch-event-source
二、项目引用
import { fetchEventSource } from "@microsoft/fetch-event-source";
三、中断会话
const ctrl = new AbortController(); // 用于中断请求
代码
const ctrl = new AbortController(); // 用于中断请求
fetchEventSource('api地址', {
headers: {
"Content-Type": "application/json",
Accept: ["text/event-stream", "application/json"],
},
body: JSON.stringify({
}),
method: 'POST',
signal: ctrl.signal,
openWhenHidden: true, // 页面退至后台时保持连接
onopen: (response) => {
console.log('打开连接')
},
onmessage: (event) => {
console.log('收到信息',event)
},
one rror: (error) => {
ctrl.abort(); // 中断请求
},
})
标签:vue,ctrl,fetch,流式,中断请求,source,fetchEventSource,sse,event
From: https://www.cnblogs.com/wutong-211/p/18546410