使用chatgpt实现微信聊天小程序代码示例

网友投稿 510 2023-11-13

目录前言效果展示原理说明服务器端代码说明微信小程序代码说明代码链接总结更新日志

前言

前一段时间使用java来调用chatgpt的接口,然后写了一个简单小程序,java调用chatgpt接口,实现专属于自己的人工智能助手,事实上,这个程序毛病挺多的,最不能让人接受的一点就是返回速度非常缓慢(即使使用非常好的外网服务器)。

使用chatgpt实现微信聊天小程序的代码示例

现在,我改进了一下程序,使用异步请求的方式,基本可以实现秒回复。并且还基于webSocket编写了一个微信小程序来进行交互,可以直接使用微信小程序来进行体验。

效果展示

部分截图如下

原理说明

在 java调用chatgpt接口,实现专属于自己的人工智能助手 我说明了java调用chatgpt的基本原理,这里的代码就是对这个代码的改进,使用异步请求的方式来进行。

注意看官方文档,我们在请求时可以提供一个参数stream,然后就可以实现按照流的形式进行返回,这种方式基本可以做到没有延迟就给出答案。

由于这次改进的思路主要就是将请求改为了异步,其他的基本一样,所以就不做解释,直接给出代码了,代码上面都有注释

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
/**
* 这个方法用于测试的,可以在控制台打印输出结果
*
* @param chatGptRequestParameter 请求的参数
* @param question                问题
*/
public void printAnswer(ChatRequestParameter chatGptRequestParameter, String question) {
asyncClient.start();
// 创建一个post请求
AsyncRequestBuilder asyncRequest = AsyncRequestBuilder.post(url);
// 设置请求参数
chatGptRequestParameter.addMessages(new ChatMessage("user", question));
// 请求的参数转换为字符串
String valueAsString = null;
try {
valueAsString = objectMapper.writeValueAsString(chatGptRequestParameter);
} catch (JsonProcessingException e) {
e.printStackTrace();
}
// 设置编码和请求参数
ContentType contentType = ContentType.create("text/plain", charset);
asyncRequest.setEntity(valueAsString, contentType);
asyncRequest.setCharset(charset);
// 设置请求头
asyncRequest.setHeader(HttpHeaders.CONTENT_TYPE, "application/json");
// 设置登录凭证
asyncRequest.setHeader(HttpHeaders.AUTHORIZATION, "Bearer " + apiKey);
// 下面就是生产者消费者模型
CountDownLatch latch = new CountDownLatch(1);
// 用于记录返回的答案
StringBuilder sb = new StringBuilder();
// 消费者
AbstractCharResponseConsumer<HttpResponse> consumer = new AbstractCharResponseConsumer<HttpResponse>() {
HttpResponse response;
@Override
protected void start(HttpResponse response, ContentType contentType) throws HttpException, IOException {
setCharset(charset);
this.response = response;
}
@Override
protected int capacityIncrement() {
return Integer.MAX_VALUE;
}
@Override
protected void data(CharBuffer src, boolean endOfStream) throws IOException {
// 收到一个请求就进行处理
String ss = src.toString();
// 通过data:进行分割,如果不进行此步,可能返回的答案会少一些内容
for (String s : ss.split("data:")) {
// 去除掉data:
if (s.startsWith("data:")) {
s = s.substring(5);
}
// 返回的数据可能是(DONE)
if (s.length() > 8) {
// 转换为对象
ChatResponseParameter responseParameter = objectMapper.readValue(s, ChatResponseParameter.class);
// 处理结果
for (Choice choice : responseParameter.getChoices()) {
String content = choice.getDelta().getContent();
if (content != null && !"".equals(content)) {
// 保存结果
sb.append(content);
// 将结果使用webSocket传送过去
System.out.print(content);
}
}
}
}
}
@Override
protected HttpResponse buildResult() throws IOException {
return response;
}
@Override
public void releaseResources() {
}
};
// 执行请求
asyncClient.execute(asyncRequest.build(), consumer, new FutureCallback<HttpResponse>() {
@Override
public void completed(HttpResponse response) {
latch.countDown();
chatGptRequestParameter.addMessages(new ChatMessage("assistant", sb.toString()));
System.out.println("回答结束!!!");
}
@Override
public void failed(Exception ex) {
latch.countDown();
System.out.println("failed");
ex.printStackTrace();
}
@Override
public void cancelled() {
latch.countDown();
System.out.println("cancelled");
}
});
try {
latch.await();
} catch (InterruptedException e) {
e.printStackTrace();
}
}

大家代码可以直接不看,反正最终的效果就是可以实现问了问题就返回结果。运行效果如下

可以发现,输出就类似于官方的那种效果,一个字一个字的输出

服务器端代码说明

我使用java搭建了一个简单的服务器端程序,提供最基础的用户登录校验功能,以及提供了WebSocket通信。

用户校验的代码

基于webSocket通信的代码

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
package com.ttpfx.server;
import com.fasterxml.jackson.databind.ObjectMapper;
import com.ttpfx.entity.UserLog;
import com.ttpfx.model.ChatModel;
import com.ttpfx.service.UserLogService;
import com.ttpfx.service.UserService;
import com.ttpfx.vo.chat.ChatRequestParameter;
import org.springframework.stereotype.Component;
import javax.annotation.Resource;
import javax.websocket.*;
import javax.websocket.server.PathParam;
import javax.websocket.server.ServerEndpoint;
import java.io.IOException;
import java.time.LocalDateTime;
import java.util.concurrent.ConcurrentHashMap;
/**
* @author ttpfx
* @date 2023/3/28
*/
@Component
@ServerEndpoint("/chatWebSocket/{username}")
public class ChatWebSocketServer {
/**
* 静态变量,用来记录当前在线连接数。应该把它设计成线程安全的。
*/
private static int onlineCount = 0;
/**
* concurrent包的线程安全Map,用来存放每个客户端对应的MyWebSocket对象。
*/
private static ConcurrentHashMap<String, ChatWebSocketServer> chatWebSocketMap = new ConcurrentHashMap<>();
/**
* 与某个客户端的连接会话,需要通过它来给客户端发送数据
*/
private Session session;
/**
* 接收的username
*/
private String username = "";
private UserLog userLog;
private static UserService userService;
private static UserLogService userLogService;
@Resource
public void setUserService(UserService userService) {
ChatWebSocketServer.userService = userService;
}
@Resource
public void setUserLogService(UserLogService userLogService) {
ChatWebSocketServer.userLogService = userLogService;
}
private ObjectMapper objectMapper = new ObjectMapper();
private static ChatModel chatModel;
@Resource
public void setChatModel(ChatModel chatModel) {
ChatWebSocketServer.chatModel = chatModel;
}
ChatRequestParameter chatRequestParameter = new ChatRequestParameter();
/**
* 建立连接
* @param session 会话
* @param username 连接用户名称
*/
@OnOpen
public void onOpen(Session session, @PathParam("username") String username) {
this.session = session;
this.username = username;
this.userLog = new UserLog();
// 这里的用户id不可能为null,出现null,那么就是非法请求
try {
this.userLog.setUserId(userService.queryByName(username).getId());
} catch (Exception e) {
e.printStackTrace();
try {
session.close();
} catch (IOException ex) {
ex.printStackTrace();
}
}
this.userLog.setUsername(username);
chatWebSocketMap.put(username, this);
onlineCount++;
System.out.println(username + "--open");
}
@OnClose
public void onClose() {
chatWebSocketMap.remove(username);
System.out.println(username + "--close");
}
@OnMessage
public void onMessage(String message, Session session) {
System.out.println(username + "--" + message);
// 记录日志
this.userLog.setDateTime(LocalDateTime.now());
this.userLog.setPreLogId(this.userLog.getLogId() == null ? -1 : this.userLog.getLogId());
this.userLog.setLogId(null);
this.userLog.setQuestion(message);
long start = System.currentTimeMillis();
// 这里就会返回结果
String answer = chatModel.getAnswer(session, chatRequestParameter, message);
long end = System.currentTimeMillis();
this.userLog.setConsumeTime(end - start);
this.userLog.setAnswer(answer);
userLogService.save(userLog);
}
@OnError
public void onError(Session session, Throwable error) {
error.printStackTrace();
}
public void sendMessage(String message) throws IOException {
this.session.getBasicRemote().sendText(message);
}
public static void sendInfo(String message, String toUserId) throws IOException {
chatWebSocketMap.get(toUserId).sendMessage(message);
}
}

我们只需要编写简单的前端代码,就可以实现和后端的socket通信。对于后端,我们只需要改一下apiKey和数据库配置就可以直接运行了。

微信小程序代码说明

我写了一个简单微信小程序来和后端进行通信,界面如下

大家只需要-源代码,然将程序中的ip改为自己服务器的ip即可

代码链接

github的地址为 https://github.com/c-ttpfx/chatgpt-java-wx可以直接使用git clone https://github.com/c-ttpfx/chatgpt-java-wx.git -代码到本地

我在github里面说明了安装使用的基本步骤,大家按照步骤使用即可

总结

上面聊天小程序就是我花2天写出来的,可能会有一些bug,我自己测试的时候倒是没有怎么遇到bug,聊天和登录功能都能正常使用。

对于微信小程序,由于我不是专业搞前端的,就只东拼西凑实现了最基本的功能(登录、聊天),大家可以自己写一个,反正后端接口都提供好了嘛,也不是很难,不想写也可以将就使用我的。

更新日志

对代码进行了重构,最新的代码已经支持代理,通过在application.yaml里面进行简单配置即可使用

?
1
2
3
4
gpt:
proxy:
host: 127.0.0.1
port: 7890

以上就是使用chatgpt实现微信聊天小程序的代码示例的详细内容,更多关于chatgpt微信聊天小程序的资料请关注

您可能感兴趣的文章:Java SpringBoot集成ChatGPT实现AI聊天springboot+chatgpt+chatUI Pro开发智能聊天工具的实践ChatGPT用于OA聊天助手导致访问量服务宕机html+css+js实现简易版ChatGPT聊天机器人基于ChatGPT+SpringBoot实现智能聊天AI机器人接口并上线至服务器的方法

版权声明:本文内容由网络用户投稿,版权归原作者所有,本站不拥有其著作权,亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容,请联系我们jiasou666@gmail.com 处理,核实后本网站将在24小时内删除侵权内容。

上一篇:个人创业做什么好赚钱?在家就可以做的互联网创业小项目
下一篇:在家赚钱的创业项目有哪些?移动互联网创业好点子
相关文章

 发表评论

暂时没有评论,来抢沙发吧~