Spring WebSocket으로 실시간 채팅 구현하기 – 기초부터 예제까지

실시간 채팅은 많은 웹 서비스에서 중요한 기능입니다. 고객 상담, 협업 툴, 소셜 네트워크 등 사용자 간의 빠른 소통이 필요한 곳이라면 반드시 고려해야 할 기술입니다. 이번 글에서는 Spring WebSocket을 활용해 기본적인 실시간 채팅 애플리케이션을 구현하는 방법을 알아보겠습니다. 코드는 단순하게, 이해는 쉽게 풀어보겠습니다.

 

WebSocket이란?

WebSocket은 클라이언트와 서버 간의 양방향 통신을 가능하게 하는 프로토콜입니다. 기존 HTTP는 요청/응답 기반이기 때문에 클라이언트가 매번 요청을 보내야 서버가 응답할 수 있습니다. 반면 WebSocket은 연결이 한 번 맺어지면 서버와 클라이언트가 자유롭게 데이터를 주고받을 수 있습니다.

 

Spring에서 WebSocket 지원

Spring에서는 WebSocket을 간단히 사용할 수 있도록 Spring WebSocket 모듈과 STOMP 프로토콜을 지원합니다. STOMP(Simple Text Oriented Messaging Protocol)는 메시지의 목적지와 형식을 명확히 구분하기 때문에 실시간 채팅과 같이 다중 사용자 환경에서 유용합니다.

 

프로젝트 셋업

Spring Boot 프로젝트 생성 시 다음 의존성을 추가합니다.

• Spring Web
• WebSocket
• Spring Boot DevTools (선택)
• Lombok (선택)

build.gradle 예시

dependencies {
    implementation 'org.springframework.boot:spring-boot-starter-web'
    implementation 'org.springframework.boot:spring-boot-starter-websocket'
    compileOnly 'org.projectlombok:lombok'
}

 

 

WebSocket 설정하기

@Configuration
@EnableWebSocketMessageBroker
public class WebSocketConfig implements WebSocketMessageBrokerConfigurer {
    @Override
    public void configureMessageBroker(MessageBrokerRegistry config) {
        config.enableSimpleBroker("/topic");
        config.setApplicationDestinationPrefixes("/app");
    }

    @Override
    public void registerStompEndpoints(StompEndpointRegistry registry) {
        registry.addEndpoint("/chat-websocket").withSockJS();
    }
}

 

 

메시지 모델

@Data
@AllArgsConstructor
@NoArgsConstructor
public class ChatMessage {
    private String sender;
    private String content;
}

 

 

Controller 작성하기

@Controller
public class ChatController {
    @MessageMapping("/chat.sendMessage")
    @SendTo("/topic/public")
    public ChatMessage sendMessage(ChatMessage message) {
        return message;
    }
}

 

 

클라이언트 코드 (HTML + JavaScript)

<script src="https://cdn.jsdelivr.net/npm/sockjs-client@1.5.1/dist/sockjs.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/stompjs@2.3.3/lib/stomp.min.js"></script>

<script>
    var socket = new SockJS('/chat-websocket');
    var stompClient = Stomp.over(socket);

    stompClient.connect({}, function(frame) {
        stompClient.subscribe('/topic/public', function(message) {
            var msg = JSON.parse(message.body);
            console.log(msg.sender + ": " + msg.content);
        });
    });

    function sendMessage() {
        var messageContent = document.getElementById('message').value;
        stompClient.send("/app/chat.sendMessage", {}, JSON.stringify({'sender': 'User1', 'content': messageContent}));
    }
</script>

 

 

기본 흐름 요약

 

1. 클라이언트가 /chat-websocket 엔드포인트로 WebSocket 연결을 생성합니다.
2. /topic/public 채널을 구독합니다.
3. 사용자가 메시지를 보내면 /app/chat.sendMessage 경로로 송신됩니다.
4. 서버가 받은 메시지를 /topic/public으로 브로드캐스트합니다.

 

여기까지 따라 하면 기본 실시간 채팅 애플리케이션이 완성됩니다.
물론 실제 서비스에서는 다음과 같은 기능들을 추가해야 합니다.

• 채팅방 분리 (다중 채널)
• 사용자 인증 및 권한
• 채팅 기록 저장 (DB 연동)
• 예외 처리 및 에러 핸들링

Spring WebSocket은 생각보다 구현이 단순하면서도 확장성이 뛰어나 실무에서도 많이 활용되고 있습니다.

필요한 부분에 WebSocket을 활용해보세요.

 

websocket