【2023】java使用WebClient实现chatGPT调用建立web socket连接

💻目录

  • 一、介绍
    • 1、使用技术
    • 2、效果
  • 二、代码
    • 1、前端代码
    • 2、后端代码
      • 2.1、maven依赖
      • 2.2、model
        • 2.2.1、请求接口的格式
        • 2.2.2、响应数据对象
      • 2.3、工具类
        • 2.3.1、🔴使用WebClient调用`chatgpt`方法
        • 2.3.2、🟠 webSocket连接对话方法
      • 2.4、Controller

一、介绍

通过java实现对chatGPT的API接口实现websocket流式输出以及接口调用两种方式代码

1、使用技术

使用到的技术包括WebClientwebSocketthymeleaf

  • WebClient:客户端的使用可以开 🍅java http客户端
  • webSocket:可以看🥒webSokcet 使用
  • thymeleaf:可以网上直接找教程,我使用的比较简单会掉用就行,或者使用html静态页面也可以

2、效果

  • websocket的具体实现效果如下,非专业前端,页面比较简陋,可以自行优化页面
    在这里插入图片描述
  • 接口调用
    在这里插入图片描述

二、代码

1、前端代码

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>Java后端WebSocketTomcat实现</title><script type="text/javascript" src="js/jquery.min.js"></script>
</head><body><strong>ChatGPT使用</strong><br /><input id="text" type="text" onkeydown="checkEnter(event)"/>
<button onclick="send()">发送消息</button>
<hr />
<button onclick="closeWebSocket()">关闭WebSocket连接</button>
<hr />
<div id="message"></div>
</body>
<script type="text/javascript">var websocket = null;//判断当前浏览器是否支持WebSocketif ('WebSocket' in window) {//改成你的地址websocket = new WebSocket("ws://localhost:8088/websocket/100");} else {alert('当前浏览器 Not support websocket')}//连接发生错误的回调方法websocket.onerror = function () {setMessageInnerHTML("WebSocket连接发生错误");};//连接成功建立的回调方法websocket.onopen = function () {setMessageInnerHTML("WebSocket连接成功");}var U01data, Uidata, Usdata//接收到消息的回调方法websocket.onmessage = function (event) {console.log(event);if (event.data !== "conn_success") {setMessageInnerHTML(event.data);// setMessageInnerHTML(event);setechart()}}//连接关闭的回调方法websocket.onclose = function () {setMessageInnerHTML("WebSocket连接关闭");}// //监听窗口关闭事件,当窗口关闭时,主动去关闭websocket连接,防止连接还没断开就关闭窗口,server端会抛异常。window.onbeforeunload = function () {closeWebSocket();}//将消息显示在网页上function setMessageInnerHTML(innerHTML) {document.getElementById('message').innerHTML += innerHTML ;}//关闭WebSocket连接function closeWebSocket() {websocket.close();}//发送消息function send() {var message = document.getElementById('text').value;websocket.send('{"msg":"' + message + '"}');setMessageInnerHTML("<br>--------------发送消息:" + message + "<br>");document.getElementById('text').value = null;}function checkEnter(event) {if (event.keyCode === 13) {send();}}
</script>
</html>

2、后端代码

2.1、maven依赖

       <!--thymeleaf模版的--> <dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-thymeleaf</artifactId><!--websocket的--> <dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-websocket</artifactId></dependency><!--webClient--><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-webflux</artifactId></dependency>       <dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-web</artifactId></dependency><dependency><groupId>org.projectlombok</groupId><artifactId>lombok</artifactId></dependency><dependency><groupId>cn.hutool</groupId><artifactId>hutool-all</artifactId><version>5.8.22</version></dependency>

2.2、model

2.2.1、请求接口的格式

如果想简单的话也可以不用封装对象,直接使用json
在这里插入图片描述
在这里插入图片描述

  • ChatGptRequestParameter
@Data
@NoArgsConstructor
@AllArgsConstructor
public class ChatGptRequestParameter {private String model = "gpt-3.5-turbo-16k-0613";
//     是否支持流式输出private boolean stream = true;//    请求对象数组List<ChatGptMessage> messages=new ArrayList();public void addMessages(ChatGptMessage message) {this.messages.add(message);}
}
  • ChatGptMessage
@Data
@NoArgsConstructor
@AllArgsConstructor
public class ChatGptMessage implements Serializable {String role;String content;
}
2.2.2、响应数据对象

在这里插入图片描述
在这里插入图片描述

  • ChatGptResponseParameter
@Data
@NoArgsConstructor
@AllArgsConstructor
public class ChatGptResponseParameter implements Serializable {String id;String object;String created;String model;Usage usage;List<Choices> choices;String system_fingerprint;
}
  • Choices
@Data
@NoArgsConstructor
@AllArgsConstructor
public class Choices implements Serializable {ChatGptMessage delta;String finish_reason;Integer index;String logprobs;
}
  • ChatGptMessage
@Data
@NoArgsConstructor
@AllArgsConstructor
public class ChatGptMessage implements Serializable {String role;String content;
}

2.3、工具类

2.3.1、🔴使用WebClient调用chatgpt方法
@Component
@Slf4j
public class WebChatGPT {/*** 自己chatGpt的ApiKey*/private String apiKey = "sk-***";private ChatGptRequestParameter chatGptRequestParameter = new ChatGptRequestParameter();/*** 推送* @param session webSocket会话对象* @param str 请求数据* @return Flux<String>*/public Flux<String> getAnswer(Session session, String str) {ChatGptMessage chatGptMessage = new ChatGptMessage("user", str);//        保存消息,用于记录前面的消息,方便上下文记忆,因为3.5不能自动实现上下文记忆chatGptRequestParameter.addMessages(chatGptMessage);return webClient().post().accept(MediaType.TEXT_EVENT_STREAM) //接收text/event-stream流的数据.body(BodyInserters.fromValue(chatGptRequestParameter)) //参数.retrieve() //执行请求并获取响应结果.bodyToFlux(String.class) // 将响应体转换为 Flux 类型,这里是将 SSE 流转换为字符串类型。.map(s -> {  //对每个响应元素进行处理log.info("Gpt输出:{}", s);if (!Objects.equals(s, "[DONE]")) {ChatGptMessage message = JSONUtil.toBean(s, ChatGptResponseParameter.class).getChoices().get(0).getDelta();String content = message.getContent();if (content != null) {try {if (session != null) {
//                                通过websocket回写到页面session.getBasicRemote().sendText(content);}log.info("Gpt输出:{}", s);} catch (IOException e) {e.printStackTrace();}return content;}}return "";}).onErrorResume(WebClientResponseException.class, ex -> Flux.just(ex.getResponseBodyAsString())) //请求失败.doFinally(signalType -> log.info("完成{}", signalType));  //在 Flux 完成时执行,无论是成功还是错误,都会打印日志表示请求完成。}private WebClient webClient(){return  WebClient.builder()
//                .clientConnector(new ReactorClientHttpConnector(
//                        HttpClient.create().proxy(proxy -> proxy.type(ProxyProvider.Proxy.HTTP).host("127.0.0.1").port(1080)) //代理
//                )).defaultHeader(HttpHeaders.ACCEPT, MediaType.APPLICATION_JSON_VALUE).defaultHeader(HttpHeaders.CONTENT_TYPE, MediaType.APPLICATION_JSON_VALUE + ";charset=UTF-8").defaultHeader(HttpHeaders.AUTHORIZATION, "Bearer " + apiKey).baseUrl("https://api.openai.com/v1/chat/completions") //官方api请求地址.build();}
}
2.3.2、🟠 webSocket连接对话方法

通过该方法和html页面建立websocket连接

@Slf4j
@Service
@ServerEndpoint("/websocket/{uid}")
@Component
public class WebSocketServer2 {//连接建立时长private static final long sessionTimeout = 600000;// 用来存放每个客户端对应的WebSocketServer对象private static Map<String, WebSocketServer2> webSocketMap = new ConcurrentHashMap<>();// 与某个客户端的连接会话,需要通过它来给客户端发送数据private Session session;// 接收idprivate String uid;private static WebChatGPT webChatGPT;static {webChatGPT = SpringUtil.getBean(WebChatGPT.class);}/*** 连接建立成功调用的方法* @author zhengfuping* @date 2023/8/22* @param session* @param uid*/@OnOpenpublic void onOpen(Session session , @PathParam("uid") String uid){session.setMaxIdleTimeout(sessionTimeout);this.session = session;this.uid = uid;if (webSocketMap.containsKey(uid)){webSocketMap.remove(uid);}webSocketMap.put(uid,this);log.info("websocket连接成功编号uid: " + uid + ",当前在线数: " + getOnlineClients());try{// 响应客户端实际业务数据!sendMessage("conn_success");}catch (Exception e){log.error("websocket发送连接成功错误编号uid: " + uid + ",网络异常!!!");}}/*** 连接关闭调用的方法* @author zhengfuping* @date 2023/8/22*/@OnClosepublic void onClose(){try {if (webSocketMap.containsKey(uid)){webSocketMap.remove(uid);}log.info("websocket退出编号uid: " + uid + ",当前在线数为: " + getOnlineClients());} catch (Exception e) {log.error("websocket编号uid连接关闭错误: " + uid + ",原因: " + e.getMessage());}}/*** 收到客户端消息后调用chatGpt的方法* @param message 客户端发送过来的消息* @param session*/@OnMessagepublic void onMessage(String message, Session session) {try {JSON parse = JSONUtil.parse(message);String msg = parse.getByPath("msg").toString();if (StrUtil.isNotEmpty(msg)){
//                调用Flux<String> answer = webChatGPT.getAnswer(session, msg);//                 触发实际的请求操作answer.subscribe();}} catch (Exception e) {log.error("websocket发送消息失败编号uid为: " + uid + ",报文: " + message);}}/*** 发生错误时调用* @param session* @param error*/@OnErrorpublic void onError(Session session, Throwable error) {log.error("websocket编号uid错误: " + this.uid + "原因: " + error.getMessage());error.printStackTrace();}/*** 实现服务器主动推送* @author yingfeng* @date 2023/8/22 10:11* @Param * @param null* @return*/public void sendMessage(String message) throws IOException {this.session.getBasicRemote().sendText(message);}/*** 获取客户端在线数* @author zhengfuping* @date 2023/8/22 10:11* @param*/public static synchronized int getOnlineClients() {if (Objects.isNull(webSocketMap)) {return 0;} else {return webSocketMap.size();}}}

2.4、Controller

  • 跳转thymeleaf页的接口
@Controller
public class ChatWeb {@RequestMapping("/webSocket")public String webSocket(){return "webSocket";}
}
  • ChatGptController:页面请求访问
@RestController
@RequestMapping("/chat")
public class ChatGptController {@Resourceprivate WebChatGPT webChatGPT;@GetMapping(value ="/stringFlux", produces = "application/json; charset=utf-8")public Flux<String> stringFlux(String c) {Flux<String> flux = webChatGPT.getAnswer(null,c);return flux;}
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/638411.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

使用 OpenLLM 构建和部署大模型应用

原文&#xff1a;使用 OpenLLM 构建和部署大模型应用 - 知乎 分享主题为&#xff1a;使用 OpenLLM 快速构建和部署大语言模型的应用。OpenLLM 是一个开源的大语言模型&#xff08;LLM&#xff09;开发框架。它支持多种开源的 LLM 模型&#xff0c;并且具有内建的两个关键的 LL…

自然语言处理研究的内容

一.基础技术 1.1 词法分析 词法分析&#xff08;Lexical Analysis&#xff09;&#xff0c;也称为词法扫描或扫描器&#xff0c;是自然语言处理&#xff08;NLP&#xff09;中的基础步骤之一&#xff0c;用于将输入的文本分割成词法单元&#xff08;Token&#xff09;。词法单…

vulnhub-dc2靶场

DC2 配置环境vmware17 nat网络配置 下载地址:DC and Five86 Series Challenges - DC-1 &#xff08;似乎从2024/1/18左右找不到这个资源了&#xff09; 攻击机kali与其在同一网段下 ip:192.168.52.130 信息收集 arp-scan -l #内网探测&#xff0c;扫描目标ip发现目标ip1…

【服务器】搭建一台属于自己的服务器

​🌈个人主页:Sarapines Programmer🔥 系列专栏:【服务器】搭建网站⏰诗赋清音:云生高巅梦远游, 星光点缀碧海愁。 山川深邃情难晤, 剑气凌云志自修。 目录 1. 购买服务器和域名 1.1 购买服务器 1.1.1 阿里云服务器 1.1.2 香草云服务器 1.2 购买域名 2. 安装宝塔…

Blender——将模型及其所有纹理与材质导入unity

前期准备 参考视频&#xff1a;7分钟教会你如何将Blender的模型材质导入unity_哔哩哔哩_bilibili 实验模型官网下载地址&#xff1a;Hoi An Ancient House Model free VR / AR / low-poly 3D model CSDN下载链接&#xff1a; 【免费】Blender三维模型-古代房屋模型&#xff…

【Linux】第三十三站:日志

文章目录 一、实现一个简单的日志1.简介2.可变参数3.错误等级4.时间5.打印每一条参数6.与前面的一些代码搭配使用 二、完整代码 一、实现一个简单的日志 1.简介 我们运行代码的时候&#xff0c;我们希望有各种各样的运行时候的一些信息。这也就是日志 它一半有日志时间&…

【GitHub项目推荐--老照片变清晰】【转载】

先来看一个效果图&#xff0c;这个开源项目能把模糊爆浆的老照片 1 s 内变成清晰、高清的有色照片。 而以上这些效果&#xff0c;无需专业 PS 技能&#xff0c;只用一个网页端的 Demo、点点鼠标上传图片就能搞定。 这个修复神器&#xff0c;由腾讯 PCG ARC 实验室研发&#xf…

结构体大揭秘:代码中的时尚之选(上)

目录 结构结构的声明结构成员的类型结构体变量的定义和初始化结构体成员的访问结构体传参 结构 结构是一些值的集合&#xff0c;这些值被称为成员变量。之前说过数组是相同类型元素的集合。结构的每个成员可以是不同类型的变量&#xff0c;当然也可以是相同类型的。 我们在生活…

【系统调用IO】open、close、read、write、lseek

目录 3 系统调用IO3.1 文件描述符3.1.1 FILE结构体3.2.2 文件描述符 3.3 open、close、read、write、lseek3.3.1 文件权限3.3.2 open3.3.3 close3.3.4 read3.3.5 write3.3.6 lseek3.3.7 代码示例 文件io和标准io的区别 橙色 3 系统调用IO 3.1 文件描述符 3.1.1 FILE结构体 …

多线程编程1

一、线程的引入 上节&#xff0c;我们介绍了进程的概念&#xff0c;以及操作系统内核是如何管理进程的&#xff08;描述组织&#xff09;&#xff0c;PCB中的核心属性有哪些&#xff0c; 引入进程这个概念&#xff0c;最主要的目的&#xff0c;就是为了解决“并发编程”这样的…

JavaScript语法摘要

JavaScript语法摘要 JavaScript语法通过各种规则和组合&#xff0c;就能创建出丰富多彩的程序呢&#xff01;它包括了怎么声明和使用变量、如何定义和赋值&#xff0c;还有怎么用运算符和表达式等等。另外&#xff0c;我还发现了一些有趣的概念&#xff0c;比如关键字、注释、…

Python学习从0到1 day7 Python判断语句

路远殊途&#xff0c;祝你得偿所愿 ——24.1.21 前言 进行逻辑判断&#xff0c;是生活中常见的行为&#xff0c;同样&#xff0c;在程序中&#xff0c;进行逻辑判断也是最为基础的功能 一、布尔类型和比较运算符 1.布尔类型 进行判断&#xff0c;有两个结果&#xff0c;True、…

springboot集成COS对象存储

1.申请腾讯云存储桶 新建密钥&#xff08;后面配置要用到&#xff09; 2.编写工具类 此处使用工具类进行基本属性配置&#xff0c;也可选择在yml中配置 package com.sfy.util;import com.qcloud.cos.COSClient; import com.qcloud.cos.ClientConfig; import com.qcloud.cos.a…

基于xgboost-LGBM-SVM的病人哮喘病识别检测 数据+代码

基于xgboost-LGBM-SVM的病人哮喘病识别检测-完整代码可直接运行_哔哩哔哩_bilibili 代码: from sklearn import preprocessing import random from sklearn.model_selection import train_test_split from sklearn.preprocessing import MinMaxScaler from sklearn import pr…

声明式注解对XXL-JOB的定时任务代码生效吗?

说明&#xff1a;源于博主的思考&#xff0c;本文验证一下声明式注解&#xff0c;即Transactional注解&#xff0c;对XXL-JOB的定时任务是否生效。 准备 首先&#xff0c;创建一个需要事务的场景。有两张表&#xff0c;一张部门表&#xff0c;一张用户表&#xff0c;用户隶属…

基于YOLOv8的目标识别、计数、电子围栏的项目开发过程

0 前言 用于生产环境中物体检测、识别、跟踪&#xff0c;人、车流量统计&#xff0c;越界安全识别 1 YOLOv8概述 YOLOv8 是Ultralytics的YOLO的最新版本。作为一种前沿、最先进(SOTA)的模型&#xff0c;YOLOv8在之前版本的成功基础上引入了新功能和改进&#xff0c;以提高性…

cupy,一个超级实用的 Python 库!

更多资料获取 &#x1f4da; 个人网站&#xff1a;ipengtao.com 大家好&#xff0c;今天为大家分享一个超级实用的 Python 库 - cupy。 Github地址&#xff1a;https://github.com/cupy/cupy 深度学习和科学计算需要处理大规模的数据和复杂的计算任务&#xff0c;而Python是一…

tag 标签

tag 标签 在使用 Git 版本控制的过程中&#xff0c;会产生大量的版本。如果我们想对某些重要版本进行记录&#xff0c;就可以给仓库历史中的某一个commit 打上标签&#xff0c;用于标识。 在本章中&#xff0c;我们将会学习如何列出已有的标签、如何创建和删除新的标签、以及…

20240116使用Firefly的AIO-3399J的预编译的Android10固件确认RT5640声卡信息

20240116使用Firefly的AIO-3399J的预编译的Android10固件确认RT5640声卡信息 2024/1/16 17:55 百度&#xff1a;RK3399 ALC5640 RK3399 RT5640 BING&#xff1a;RK3399 ALC5640 LINE-IN接麦克风不会有声音的。 耳机只有右边有声音&#xff0c;但是偏小&#xff0c;可以通过音量…

C++ memmove 学习

memmove&#xff0c;将num字节的值从源指向的位置复制到目标指向的内存块。 允许目标和源有重叠。 当目标区域与源区域没有重叠则和memcpy函数功能相同。 宽字符版本是wmemmove&#xff0c;安全版本加_s&#xff1b; #include "stdafx.h" #include<iostream&g…