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) {}
    },
  });

即可完成套壳。

相关推荐
San309 小时前
CSS3 星球大战:用前端技术打造震撼的3D动画效果
前端·css·html
用户12039112947269 小时前
从零构建一个HTML5敲击乐Web应用:前端开发最佳实践指南
前端
Violet_YSWY9 小时前
将axios、async、Promise联系在一起讲一下&讲一下.then 与其关系
开发语言·前端·javascript
San309 小时前
扩展卡片效果:用 Flexbox 和 CSS 过渡打造惊艳交互体验
前端·javascript·css
写代码的皮筏艇9 小时前
JS数据类型转换
前端·javascript
Qinana10 小时前
🌟 从 CSS 到 Stylus:打造更优雅、高效的样式开发体验
前端·javascript·css
AAA阿giao10 小时前
弹性布局:CSS 布局的“变形金刚”来了!
前端·css
烟袅10 小时前
🧱 从 inline-block 到 Flexbox:告别“空白符陷阱”,拥抱现代布局
前端·css
程序员Sunday10 小时前
还在用 setTimeout?试试 requestIdleCallback 吧!
前端·javascript
非凡ghost10 小时前
Flameshot(开源免费的截图工具) 中文绿色版
前端·javascript·后端