Nellie's Blog

카프카에서 웹소켓으로 메시지를 전송하여 실시간 처리를 해야한다. 지금 나는 백엔드 개발자인데, 프론트에 내가 만든 mqtt 정보 (url, 인증정보, 포트 등) 을 제공해주어야 한다.  백엔드 단에서는 테스트가 모두 완료되었지만, 제공하기 전에, 내가 직접 vue 프론트 프로젝트를 만들어서 내가 보낸 카프카 메시지를 잘 받아오는지 확인하고 싶었다.  백엔드 간단한 코드와 vue 코드를 직접 작성하고, 테스트 하는 과정을 정리했다.    사용한 기술 및 버전 스프링 부트 : 2.5.4자바 : 1.8카프카  : 3.7.0MQTT : 1.2.5 (vue 에서는 5.9.1)vue  : 3.2.13 백엔드 코드1. 차량 ID 별로 MQTT 토픽 생성하여 전송먼저 카프카 컨슈머에서 데이터를 param으로 받고,ob..

차량의 실시간 위치 데이터 (위도, 경도) 를 MQTT를 사용한 웹소켓으로 대시보드에 실시간으로 변하는 데이터를 보여주었다. 카프카 컨슈머에서 받은 데이터를 바로 MQTT로 메시지 전송하였다. MQTT 프로토콜을 지원하는 메시지 브로커인 EMQX 오픈 소스 브로커를 사용하였다. 실시간으로 데이터를 보여주는 것이 목적이었고, 그 다음으로는 초당 몇건을 보여줄 수 있는지를 테스트 했다.   스프링 부트 버전 : 2.5.4자바 버전 : 1.8카프카 버전 : 3.7.0MQTT 버전 : 1.2.5 pom.xml 의존성을 아래와 같이 받아준다.  org.eclipse.paho org.eclipse.paho.client.mqttv3 1.2.5 org.springframework.integrati..