chatgpt发送消息按钮是灰色的 开发chatgpt 之 SSE(Server

默认分类1年前 (2023)发布 admin
42 0
ChatGPT国内版

提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档

文章目录

如果有问题可以联系我**:

前言

之前写过一篇使用 SSE(-Sent )发送GET请求接受 数据的文章:

如果没看过可以去看一下:

从零开始开发自己的平台 之 SSE(-Sent )客户端和服务端

在文章最后留了一个问题 SSE是通过get参数发送消息的,但是get是有限制的,因此这个方法并

不好,那如何像一样让SSE发送POST 请求呢?本文讲解如何使用fetch实现。

一、fetch是什么?

fetch是中一种用于发送网络请求的API。使用fetch,您可以发送HTTP请求(如GET、

chatgpt发送消息按钮是灰色的 开发chatgpt 之 SSE(Server

POST、PUT、等),并处理响应。它返回一个对象,允许您使用then()方法来处

理成功的响应或catch()方法来处理错误。

二、fetch 发送POST请求的示例

fetch('url', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json'
  },
  body: JSON.stringify({ name: 'John', age: 30 })
})
  .then(response => response.json())
  .then(data => {
    // 处理返回的数据
    console.log(data);
  })
  .catch(error => {
    // 处理错误
    console.error('请求失败:', error);
  });

上面的示例比较简单就是使用fetch发送了一个POST请求,请求的内容也比较简单。然后输出返回

的内容,这样请求是正常的传输而不是流式传输,我们使用的参数 需要使用流式传输。我

们应该如何使用流式传输呢

三、fetch 使用流式传输

       const reader = response.body.getReader();
        let result = "";
        while (true) {
          const { done, value } = await reader.read();
          if (done) break;
		  let result=new TextDecoder().decode(value)
		  console.log(result)
        }

在上面的代码中,使用.body.()方法来获取一个可读取响应体数据的对象

的主要原因是为了支持流式()读取响应数据。当我们发送请求并获取响应时,响应体

chatgpt发送消息按钮是灰色的 开发chatgpt 之 SSE(Server

数据可能会以分块()的形式传输,而不是一次性将整个响应体传输完毕。这种分块传输

对于处理大型响应或网络速度较慢的情况非常有用,它允许我们逐步处理响应数据,而不必等待整

个响应完成。对象提供了一个read()方法,它可以异步读取响应体的下一个分块数据。通过

使用await .read(),我们可以等待并获取下一个数据分块的内容。在代码中的循环中,我们

使用.read()读取数据分块使用对象进行流式读取可以提高效率和性能,特别是当处理

大量数据或网络延迟较高时。它允许我们逐步处理响应数据,减少内存占用和等待时间。

因此,使用()来读取返回的内容是为了支持流式处理响应数据,使得代码更具灵活性和

效率。使用读取流的字节流数据 然后再用将流数据解码为字符串。这样就实现了fetch发送POST 读取

返回流数据。

总结

通过上面的代码可以建立一个基于本地html的客户端,如果是自己做平台不想暴漏key也可以让fetch链接自己的服务器,自己服务器在通过sse和客户端通讯就行了。上面代码没有主体数据部分,这部分可自行构造,和上面的示例一样格式即可。如果还有不明白的地方可以私信或者联系我

如果有问题可以联系我**:

© 版权声明
广告也精彩

相关文章

暂无评论

暂无评论...