<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>客户聊天</title>
</head>
<body>
<div id="chat-box"></div>
<input type="text" id="input-box">
<button onclick="sendMessage()">发送</button>
<script>
function callBaiduWorkshopSSE(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
}));
}
const chatBox = document.getElementById('chat-box');
const inputBox = document.getElementById('input-box');
let url = "https://aip.baidubce.com/rpc/2.0/ai_custom/v1/wenxinworkshop/plugin/4vnm7dqfvtnt6qs2/";
let access_token = "24.3a852625ddce37cbb3b326aec0b26014.2592000.1702109453.282335-42483318";
let body = {
"query": "",
"plugins": ["uuid-zhishiku"],
"verbose": true,
"stream": true
};
function sendMessage() {
const message = inputBox.value.trim();
if (message === '') {
return;
}
const messageElement = document.createElement('div');
messageElement.innerText = '我:' + message;
chatBox.appendChild(messageElement);
body.query = message;
callBaiduWorkshopSSE(url, access_token, body, (msg) => {
if (msg.type == "DATA") {
const messageElement = document.createElement('div');
messageElement.innerText = '机器人:' + msg.content.result;
chatBox.appendChild(messageElement);
} else if (msg.type == "END") {
console.log("响应返回结束");
} else {
console.log(msg);
}
})
inputBox.value = '';
}
</script>
</body>
</html>
写了上面的代码,提问后机器人总是返回undefined,有谁知道问题在哪里么?url和access_token都没有问题,我使用aipfox测试过
谢谢大家!我终于找到问题的所在了,果然是鉴权出了问题:
1 需要在创建的应用里面重新更新一下服务,但不用更新access_token.
2 我获取的acces_token 在写的时候尾部多了一个x
抱歉给大家添麻烦了,但是发现这个问题的人不止一位,我不知道该怎样采纳?就只能按照第一位发现是鉴权问题的码友采纳了。谢谢大家!