FastGpt 使用记录

记录一下使用FastGpt的心得

文档地址

stream模式

第一版使用了非stream的调用模式

import axios from "axios";

const headers = {
  Authorization: "Bearer fastgpt-API KEY",
  "Content-Type": "application/json",
};

export const chatCompletions = (data: any) =>
  axios.post("https://ai.cnhcym.com/api/v1/chat/completions", data, {
    headers,
  });

const [err, res] = await to(
  chatCompletions({
    chatId: this.messageId,
    stream: false,
    messages: [
      {
        role: "user",
        content: [
          {
            type: "text",
            text: "用户输入的内容",
          },
        ],
      },
    ],
  })
);

if (res?.data?.choices?.length) {
  // 对返回数据进行一系列操作
} else {
}

这种做法和平时写业务代码没有什么区别,一次性返回所有内容,但是用户等待结果的时间会很长很长,体验极差

steam模式

为了提升用户体验(绝对不是因为我一开始没有看到有steam模式),改用了steam模式

try {
  // 创建一个控制器,用于中止请求
  const controller = new AbortController();
  // 使用变量把控制器存储起来
  this.request = controller;
  const response = await fetch(
    "https://ai.cnhcym.com/api/v1/chat/completions",
    {
      method: "POST",
      headers: {
        "Content-Type": "application/json",
        Accept: "text/event-stream",
        Authorization: "Bearer fastgpt-API KEY",
      },
      body: JSON.stringify({
        chatId: this.messageId,
        stream: true,
        detail: true,
        messages: [
          {
            role: "user",
            content: [
              {
                type: "text",
                text: "用户输入的内容",
              },
            ],
          },
        ],
      }), // 请求体
      signal: controller.signal, // 传递 signal 用于中止
    }
  );

  if (!response.body) {
    throw new Error("ReadableStream not supported in this browser.");
  }

  const reader = response.body.getReader(); // 获取流式数据的读取器
  const decoder = new TextDecoder("utf-8");

  while (true) {
    const { done, value } = await reader.read(); // 逐块读取数据
    if (done) break;
    const result = decoder.decode(value, { stream: true }); // 解码流式数据

    const [event, data] = result.split("\n");

    // 返回值的类型
    const eventType = event.replace("event: ", "");
    // 返回值的内容
    const info = getJSONToParse(data.replace("data: ", "")) as any;

    if (eventType === "answer" && this.newMessage && info?.choices?.length) {
      // 处理数据
    }
  }
} catch (error) {
} finally {
}