Лучший способ использовать Websocket с Spring Boot и Vuejs

Question

Я пытаюсь использовать Websocket с внутренним интерфейсом с пружинной загрузкой (в качестве API-интерфейса) и внешним интерфейсом Vuejs.

Я беру простой пример использования, чтобы изложить свой вопрос. Некоторые пользователи зашли на мой сайт, и есть функция обмена сообщениями. Пользователь A отправляет сообщение пользователю B. Пользователь B фактически зарегистрирован, и я хочу уведомить пользователя B о получении нового сообщения.

Я вижу 3 способа сделать это с помощью веб-сокетов:

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")), который вызывает фасад, сервис, дао ксначала сохраните сообщение, затем верните сообщение подписчикам

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

Метод «один и два» не имеет большой разницы, поскольку вы используете axios из npm для отправки запроса, а другой - напрямую, а третий - контроллер и фасад 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