React笔记-Ant Design X样本间对接智谱AI

目标

后端对接是智谱AI。

过程

先把Ant Design X样本间搭建好,通过此篇博文获得智谱AI的URL等

智谱AI开放平台

看下此篇博文的"使用API接入"

通义千问 - Ant Design X

将样本间代码的:

javascript 复制代码
  const [agent] = useXAgent({
    request: async ({ message }, { onSuccess }) => {
      onSuccess(`Mock success return. You said: ${message}`);
    },
  });

修改为:

javascript 复制代码
const { create } = XRequest({
    baseURL: 'https://open.bigmodel.cn/api/paas/v4/chat/completions',
    dangerouslyApiKey: 'xxxxx',
    model: 'glm-4-plus',
  });
  const [agent] = useXAgent({
    request: async ({ message }, { onSuccess, onUpdate }) => {
      try {
        let content: string = '';
        create(
          {
            messages: [{ role: 'user', content: message }],
            stream: true,
          },
          {
            onSuccess: (chunks) => {
              console.log('sse chunk list', chunks);
              onSuccess(content)
            },
            onError: (error) => {
              console.log('error', error);
            },
            onUpdate: (chunk) => {
              console.log('sse object', chunk);
              try{
                const data = JSON.parse(chunk.data);
                content +=  data?.choices[0].delta.content;
              }
              catch(error){
                console.log(error);
                //return;
              }
              console.log(content);
              onUpdate(content);
            },
          },
        );
      } catch (error) {}
    },
  });

即可完成套壳。

相关推荐
haaaaaaarry14 分钟前
Element Plus常见基础组件(二)
开发语言·前端·javascript
Hello_Embed38 分钟前
嵌入式 C 语言入门:循环结构学习笔记 —— 从语法到实用技巧
c语言·笔记·stm32·学习
xyphf_和派孔明39 分钟前
关于echarts的性能优化考虑
前端·性能优化·echarts
PyHaVolask1 小时前
HTML 表单进阶:用户体验优化与实战应用
前端·javascript·html·用户体验
A了LONE1 小时前
cv弹窗,退款确认弹窗
java·服务器·前端
AntBlack2 小时前
闲谈 :AI 生成视频哪家强 ,掘友们有没有推荐的工具?
前端·后端·aigc
花菜会噎住2 小时前
Vue3核心语法进阶(computed与监听)
前端·javascript·vue.js
tngyrn2 小时前
机试备考笔记 2/31
笔记
tt5555555555552 小时前
电力系统分析学习笔记(二)- 标幺值计算与变压器建模
笔记·学习·电路
花菜会噎住3 小时前
Vue3核心语法基础
前端·javascript·vue.js·前端框架