当前位置:   article > 正文

简述js接收读取GPT的stream流的两种方法:EventSource与Fetch_fetcheventsource

fetcheventsource

下面是模板兔精心调试+亲测的js接收读取stream流的两种方法:EventSource与Fetch,供大家参考。可用于对接GPT等一些AI接口,从而在页面像打字一样输出内容。

EventSource:

var es = new EventSource(result.url, { withCredentials: true });
es.onerror = function (event) {
    //执行错误的页面逻辑
    es.close();
}
es.onmessage = function (event) {
    //console.log(event.data);

    if (event.data == "[DONE]") {
        //执行完成的页面逻辑
        es.close();
    }else{

    }
}

Fetch:

fetch(result.url, {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({ test: 'test' }),
}).then(response => {
const reader = response.body.getReader();
const decoder = new TextDecoder('utf-8');
let buffer = '';

function processStreamResult(result2) {
const chunk = decoder.decode(result2.value, { stream: !result2.done });
buffer += chunk;
//逐条解析后端返回数据
const lines = buffer.split('\n');
buffer = lines.pop();

lines.forEach(line => {
if (line.trim().length > 0) { 
//console.log(line);

if(line == 'data: [DONE]'){
    //执行完成的页面逻辑
}else{

} 

}
});

if (!result2.done) {
    return reader.read().then(processStreamResult);
}
}

return reader.read().then(processStreamResult);
})
.catch(error => {
    //console.error('Error:', error);
});

原文:https://www.mobantu.com/9934.html

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/盐析白兔/article/detail/811345?site
推荐阅读
相关标签
  

闽ICP备14008679号