kangjacob 2023-11-09 16:41 采纳率: 96.8%
浏览 24
已结题

为什么总是返回undefined?

<!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
抱歉给大家添麻烦了,但是发现这个问题的人不止一位,我不知道该怎样采纳?就只能按照第一位发现是鉴权问题的码友采纳了。谢谢大家!

  • 写回答

22条回答 默认 最新

  • 社区专家-Monster-XH 2023-11-09 16:42
    关注

    基于Monster 组和AIGC的调写:若有帮助,还望采纳~~:

    • 首先,,你的代码没有任何问题。
    • 如果服务端接口有变,或者服务端处理中有问题,都可能导致undefined的情况出现。
    • 要解决问题,你要调试和检查服务端接口的响应。
    • 返回undefined是因为在访问msg.content.result时,msg.content对象中不存在result属性。通常是因为服务端响应的格式与前端代码预期的格式不一致。
    • 你要检查从百度工作坊SSE接口返回的数据格式,确保msg.content中确实包含了result属性。

    排查步骤:

    1. 检查响应结构: 先要确认的是百度工作坊SSE接口返回的数据结构是否有变化,是否包含了result字段。

    2. 服务端错误: 如果响应结构正确,那可能是服务端在处理请求时发生了错误,没有生成预期的result字段。

    3. 日志输出: 在callBaiduWorkshopSSE函数中的onMessage回调里打印整个msg对象,以便查看实际返回的数据结构。例如,可以在if (msg.type == "DATA") { ... }块前添加console.log(msg)

    4. 调试: 用浏览器的开发者工具对网络请求进行监控和调试,查看实际的请求响应数据。

    5. 错误处理: 增加错误处理逻辑,如果msg.content.resultundefined,那么显示一个默认消息或者进一步的错误信息。

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论 编辑记录
查看更多回答(21条)

报告相同问题?

问题事件

  • 系统已结题 11月18日
  • 已采纳回答 11月10日
  • 修改了问题 11月10日
  • 赞助了问题酬金100元 11月9日
  • 展开全部