使用fetchEventSource

参考：https://blog.csdn.net/qq_43750656/article/details/131591198

https://zhuanlan.zhihu.com/p/686618062

首先安装：

<code>npm install --save @microsoft/fetch-event-source

我参考各个资料写的函数：

// 流式传输处理函数

export function sseRequest(url: string, data: object, successCallback: Function, closeCallback?: Function, errCallback?: Function) {

const abortController = new AbortController()

fetchEventSource(import.meta.env.VITE_APP_BASE_API + url, {

method: 'POST',

headers: {

'Content-Type': 'application/json;charset=utf-8',

'Accept': '*/*',

'token': localStorage.getItem('token')!

},

body: JSON.stringify(data),

openWhenHidden: true, // 取消visibilityChange事件

signal: abortController.signal, // AbortSignal

// 按需添加此函数，不用就不添加

async onopen(response) {

if (response.ok && response.headers.get('content-type') === EventStreamContentType) {

return; // everything's good

} else if (response.status >= 400 && response.status < 500 && response.status !== 429) {

// client-side errors are usually non-retriable:

throw new FatalError();

} else {

throw new RetriableError();

}

},

onmessage(ev) {

// 每当消息推送过来时，就调用处理函数处理消息

successCallback(ev)

},

onerror(err) {

abortController.abort()

if (errCallback) { errCallback(err) }

throw err

},

onclose() {

abortController.abort()

if (closeCallback) { closeCallback() }

}

})

}

// 调用sseRequest示例：

export const beginWrite = (topic: string, styleId: string, style: string) => {

const writeStore = useWriteStore()

function successCallback(ev: { data: string, event: string, id: string, retry: number }) {

if (ev.event === 'message') {

const newStr = ev.data.replace(/_::_/g, '\n\n').replace(/_:_/g, '\n').replace(/_._/g, ' ')

writeStore.sseInput += newStr

}

if (ev.event === 'message_end') {

writeStore.sseInput = ''

}

}

sseRequest('/knowledge/know_write', { topic, styleId, style }, successCallback)

}