websocket的升华学习

本文介绍了如何结合SpringBoot的WebSocket支持和GPT-3API创建一个简单的聊天应用。首先添加WebSocket依赖,然后配置WebSocket服务器端,接着编写WebSocket消息处理类,集成OpenAI的Java库进行响应生成。最后,提供了一个简单的HTML客户端页面来交互。
摘要由CSDN通过智能技术生成

今日在复习websocket时简单写了一个聊天的功能然后突发奇想接入chargpt,历经不断的bug下面是成果展示!!!!!

 第一步怎么搭建一个简单的websocket的服务端呢,首先一定要是springboot项目导入websocket依赖

        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-websocket</artifactId>
        </dependency>

第二步把websocket放到容器中去,websocketconfig

@Configuration
@EnableWebSocket
public class WebSocketConfig implements WebSocketConfigurer {

    private final WebSocketHandler webSocketHandler;

    public WebSocketConfig(WebSocketHandler webSocketHandler) {
        this.webSocketHandler = webSocketHandler;
    }

    @Override
    public void registerWebSocketHandlers(WebSocketHandlerRegistry registry) {
        registry.addHandler(webSocketHandler, "/websocket")
                .setAllowedOrigins("*");
    }
}

类是一个配置类,用于将 WebSocket 相关的组件注册到 Spring Boot 容器中进行管理

第三步写一个websocket消息处理类

@Component
public class WebSocketHandler extends AbstractWebSocketHandler {
    private static final long TIMEOUT = 60000; // 超时时间为60秒

    private final WebSocketContainer container;

    public WebSocketHandler() {
        container = ContainerProvider.getWebSocketContainer();
    }

    @Override
    public void afterConnectionEstablished(WebSocketSession session) throws Exception {
        super.afterConnectionEstablished(session);
        container.setDefaultMaxSessionIdleTimeout(TIMEOUT);
    }
    @Override
    protected void handleTextMessage(WebSocketSession session, TextMessage message) throws Exception {

        // 处理接收到的文本消息
        String receivedMessage = message.getPayload();
        // 设置对话的起始消息
        ChatMessage[] prompt = {
                new ChatMessage(ChatMessageRole.SYSTEM.value(), "你好"),
                new ChatMessage(ChatMessageRole.USER.value(), receivedMessage)
        };
        ObjectMapper mapper = defaultObjectMapper();
        Proxy proxy = new Proxy(Proxy.Type.HTTP, new InetSocketAddress("127.0.0.1", 17890));
        OkHttpClient client = defaultClient("自己的key", Duration.ofDays(1))
                .newBuilder()
                .proxy(proxy)
                .build();
        Retrofit retrofit = defaultRetrofit(client, mapper);
        OpenAiApi api = retrofit.create(OpenAiApi.class);
        OpenAiService service = new OpenAiService(api);
        ChatCompletionRequest chatCompletionRequest = ChatCompletionRequest.builder()
                .model("gpt-3.5-turbo")
                // 下面两项数值控制模型输出的随机性,对回答的稳定性要求高时,可设置随机性为最低
                .temperature(0.0D)
                .topP(1.0)
                .messages(Arrays.asList(prompt))
                .build();
        System.out.println("客户端: " + receivedMessage);
        String aiReply= service.createChatCompletion(chatCompletionRequest).getChoices().get(0).getMessage().getContent();
        System.out.println("AI: " + aiReply);
        String replyMessage ="AI: " + aiReply;

        session.sendMessage(new TextMessage(replyMessage));
    }
}

这一步要导入opai的依赖

       <dependency>
            <groupId>com.theokanning.openai-gpt3-java</groupId>
            <artifactId>service</artifactId>
            <version>0.12.0</version>
        </dependency>

最后一步因为websocket是一个长链接的通信协议,所以我们需要一个客户端页面去和他互动,我这里简单写了一个没有优美的页面只有功能大家可以自行优化

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>WebSocket Chat</title>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script>
        var socket = new WebSocket("ws://localhost:8080/websocket");

        socket.onopen = function(event) {
            console.log("WebSocket connection established.");
        };

        socket.onmessage = function(event) {
            var message = event.data;
            console.log("Received message: " + message);
            // 处理收到的消息,例如在页面上显示等
            $("#messages").append("<p>" + message + "</p>");
        };

        socket.onclose = function(event) {
            console.log("WebSocket connection closed.");
        };

        function sendMessage() {
            var message = $("#messageInput").val();
            socket.send(message);
            $("#messageInput").val("");
        }
    </script>
</head>
<body>
<div id="messages"></div>
<input type="text" id="messageInput" placeholder="Type your message">
<button onclick="sendMessage()">Send</button>
</body>
</html>

ok,今日学习到此为止

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值