将 Websocket 与 Spring Boot 和 Vuejs 一起使用的最佳方式

Question

我尝试将 Websocket 与 Spring Boot 后端（作为 API）和 Vuejs 前端一起使用。

我用一个简单的用例来揭示我的问题。一些用户登录了我的网站，并且有一个消息传递功能。用户 A 向用户 B 发送消息。用户 B 实际已登录，我想通知用户 B 有新消息到达。

我看到了 3 种使用 websockets 的方法：

1 - 当用户 A 发送消息时，Axios 帖子会调用 API 以保存消息，如果 Axios 响应成功，我会调用类似

this.stompClient.send("/app/foo", JSON.stringify(bar), {})

2 - 当用户 A 发送消息时，我只调用类似

this.stompClient.send("/app/foo", JSON.stringify(bar), {})

这是我的控制器的方法（使用 @MessageMapping("/xxxx") @SendTo("/topic/yyyy") 注释）首先调用外观、服务、dao，保存消息，然后将消息返回给订阅者

3 - 我保留了我的实际控制器、外观、服务和 DAO，并在保存成功时添加如下内容：

@Autowired SimpMessagingTemplate webSocket; 
...
@GetMapping("/send-message")
public ResponseEntity sendMessage(@AuthenticationPrincipal User user, ....) {
    service.saveMessage(....);
    webSocket.convertAndSend("/ws/message-from", message);

没有新控制器包含@MessageMapping("/xxxx") @SendTo("/topic/yyyy")。用户 B 刚刚订阅了“/ws/message-from”

你能帮帮我吗？

在这3种方式中有没有好的方法？

谢谢。

Answer 1

第一种方法和第二种方法没有太大区别，你使用 npm 中的 axios 发送请求，另一种你可以直接使用，而第三种方法你使用控制器和外观 dao 在一个地方。它是关于架构和如何作为要求，您想发送对框架的请求。

他们在他们的水平上提供最好的服务，直到您提出具体要求。

建议使用 axios。 它有以下优点：

supports older browsers (Fetch needs a polyfill)
has a way to abort a request
has a way to set a response timeout
has built-in CSRF protection
supports upload progress
performs automatic JSON data transformation
works in Node.js