花200块咨询费买的百度千帆大模型的流式数据解析方法

EventSource只能使用GET方法，所以只能使用fetch或者xhr来实现，该示例使用的fetch来实现。

//千帆流式接口js调用demo
function callWenXinWorkshopSSE(url, access_token, body, onMessage) {
    body.stream = true;
    const decoder = new TextDecoder("utf-8");
    let buffer = '';
    let dataMsgBuffer = '';
    const processMessage = (reader) => {
        reader.read().then(content => {
            buffer += decoder.decode(content.value, {stream: !content.done});
            const lines = buffer.split('\n');
            buffer = lines.pop();
            lines.forEach(line => {
                if (line == "") { //读取到空行，一个数据块发送完成
                    onMessage({
                        type: "DATA",
                        content: JSON.parse(dataMsgBuffer)
                    });
                    dataMsgBuffer = "";
                    return;
                }
                let [type] = line.split(":", 1);
                let content = line.substring(type.length + 1);
                if (type == 'data') { //数据块没有收到空行之前放入buffer中
                    dataMsgBuffer += content.trim();
                } else if (type == '' && content != '') { //服务端发送的注释，用于保证链接不断开
                    onMessage({
                        type: "COMMENT",
                        content: content.trim()
                    });
                } else {
                    onMessage({
                        type: type,
                        content: content.trim()
                    })
                }
            })
            if (!content.done) {
                processMessage(reader);
            } else {
                onMessage({
                    type: "END"
                })
            }
        })
    }
    fetch(`${url}?access_token=${access_token}`, {
        headers: {
            "Content-Type": "application/json"
        },
        method: "POST",
        body: JSON.stringify(body)
    })
        .then(response => response.body.getReader())
        .then(reader => processMessage(reader))
        .catch(error => onMessage({
            type: "ERROR",
            content: error
        }));
}

let url = "https://aip.baidubce.com/rpc/2.0/ai_custom/v1/wenxinworkshop/chat/completions"
let access_token = "
let body = {
    "messages": [
        {
            "role": "user",
            "content": "给我推荐一些自驾游路线"
        }
    ]
}
callWenXinWorkshopSSE(url, access_token, body, (msg) => {
    if (msg.type == "DATA") {
        console.log(msg.content.result);
    } else if (msg.type == "END") {
        console.log("响应返回结束");
    } else {
        console.log(msg);
    }
})