ant-design / pro-chat

🤖 Components Library for Quickly Building LLM Chat Interfaces.

Home Page:https://pro-chat.antdigital.dev

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

🐛[BUG] 使用 StreamingTextResponse ts 报语法错误

yuruotong1 opened this issue · comments

🐛 bug 描述

我的代码为:
image

image

详细错误信息如下:

Type '(messages: Record<string, any> & ModelConfig) => Promise<StreamingTextResponse>' is not assignable to type 'ChatListRequest<Record<string, any>>'.
  Type 'Promise<StreamingTextResponse>' is not assignable to type 'Promise<ChatMessage<Record<string, any>>[]>'.
    Type 'StreamingTextResponse' is missing the following properties from type 'ChatMessage<Record<string, any>>[]': length, pop, push, concat, and 35 more.ts(2322)

应该是这个 ai 包升级导致了用法发生了变化,文档需要更新下了

应该是这个 ai 包升级导致了用法发生了变化,文档需要更新下了

请问大佬能不能发一下最新的用法,新版本的ai已经废弃掉了文档的用法!我的openai代码如下:

import { streamText } from "ai";
import { createOpenAI } from '@ai-sdk/openai';

export default async (messages: any)=> {
    const configType =  await window.api.getConfig()
    const llm = JSON.parse(JSON.parse(configType.content).llm)
    // todo从数据库中拿配置项数据
    // const { messages = [] }: Partial<{ messages: Array<any> }> = await request.json();

    const openai = createOpenAI({
    apiKey: llm.apiKey, 
    baseURL: llm.baseURL, 
  });

  // const PickMessages = messages.map((message) => {
  //   return {
  //     role: message.role,
  //     content: message.content,
  //   };
  // });

    const res = await streamText({
      model: openai(llm.model),
      messages: messages
  });
    console.log('res', res)
    // const stream = OpenAIStream(res);
    return res.textStream;
}

调用 pro-chat 的代码如下:

 <div style={{ background: theme.colorBgLayout }}>
    <ProChat
        helloMessage={
            '<b>你好,我叫智子,你的智能Agent助手!</b><br><br>你可以输入“/”搜索行为,或者可有什么要求可以随时吩咐!'
        }
        request={async (messages) => {
            console.log('messages', messages.fewShots)
            const response = await useChat(JSON.stringify({ messages: messages }))
            // 使用 Message 作为参数发送请求
            return response// 支持流式和非流式
    }}
  />
  </div>

稍后我看看把文档更新一版本,还没来得及看新的用法

稍后我看看把文档更新一版本,还没来得及看新的用法

感谢您的回复,期待文档更新!

import { createOpenAI } from '@ai-sdk/openai';
import { StreamingTextResponse, streamText } from 'ai';

export async function POST(request: Request) {
  const { messages = [] }: Partial<{ messages: Array<any> }> = await request.json();

  const PickMessages = messages.map((message) => {
    return {
      role: message.role,
      content: message.content,
    };
  });

  const openai = createOpenAI({
    // custom settings, e.g.
    apiKey: 'OpenAI Key', // your openai key
    baseURL: 'base url', // if u dont need change baseUrl,you can delete this line
    compatibility: 'compatible',
  });
  const stream = await streamText({
    model: openai('gpt-3.5-turbo'),
    messages: [...PickMessages],
  });
  return new StreamingTextResponse(stream.textStream);
}

文档在更新中,可以参考这个例子。

import { createOpenAI } from '@ai-sdk/openai';
import { StreamingTextResponse, streamText } from 'ai';

export async function POST(request: Request) {
  const { messages = [] }: Partial<{ messages: Array<any> }> = await request.json();

  const PickMessages = messages.map((message) => {
    return {
      role: message.role,
      content: message.content,
    };
  });

  const openai = createOpenAI({
    // custom settings, e.g.
    apiKey: 'OpenAI Key', // your openai key
    baseURL: 'base url', // if u dont need change baseUrl,you can delete this line
    compatibility: 'compatible',
  });
  const stream = await streamText({
    model: openai('gpt-3.5-turbo'),
    messages: [...PickMessages],
  });
  return new StreamingTextResponse(stream.textStream);
}

文档在更新中,可以参考这个例子。

@ONLY-yours

我试了一下 pro-chat 组件还是报错,报错信息:

image

我的代码是这么写的:

 <div style={{ background: theme.colorBgLayout }}>
    <ProChat
        helloMessage={
            '你好,我叫智子,你的智能Agent助手!有什么要求可以随时吩咐!'
        }
        request={async (messages) => {
            console.log('messages', JSON.stringify(messages))
            const response = await useChat(JSON.stringify(messages))
            // 使用 Message 作为参数发送请求
            return response// 支持流式和非流式
    }}
  />
  </div>
import { StreamingTextResponse, streamText } from "ai";
import { createOpenAI } from '@ai-sdk/openai';

export async function useChat(messages: any){
  const configType =  await window.api.getConfig()
  const llm = JSON.parse(JSON.parse(configType.content).llm)

  const openai = createOpenAI({
    // custom settings, e.g.
    apiKey: llm.apiKey, // your openai key
    baseURL: llm.baseURL, // if u dont need change baseUrl,you can delete this line
    compatibility: 'compatible',
  });
  const stream = await streamText({
    model: openai(llm.model),
    messages: messages,
  });
  console.log('stream', stream)
  return new StreamingTextResponse(stream.textStream);
}

@yuruotong1 我试了下,应该是没问题的,确定下版本:

    "ai": "^3.2.0",
    "openai": "^4.24.7",
    "@ai-sdk/openai": "^0.0.33",

@yuruotong1 我试了下,应该是没问题的,确定下版本:

    "ai": "^3.2.0",
    "openai": "^4.24.7",
    "@ai-sdk/openai": "^0.0.33",

@ONLY-yours
我看了你的 demo 代码,你用的 pro-chat 好像不是最新版本?

我用的版本是:

"@ant-design/pro-chat": "^2.1.14",