CRIZEL
  • HOME
  • FOOD
  • GS
  • BOARD
홈FOODGS전체메뉴

© 2025 CRIZEL. rhzhzh3@naver.com

카테고리1프로그래밍
카테고리2스프링
제목스프링 웹소켓
작성자고성훈
작성일2026-04-02
<egov4.2 기준>

1. pom.xml

<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-websocket</artifactId>
<version>${spring.maven.artifact.version}</version>
</dependency>
2. JAVA

- WebSocketConfig.java
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.socket.WebSocketHandler;
import org.springframework.web.socket.config.annotation.EnableWebSocket;
import org.springframework.web.socket.config.annotation.WebSocketConfigurer;
import org.springframework.web.socket.config.annotation.WebSocketHandlerRegistry;

@Configuration
@EnableWebSocket
public class WebSocketConfig implements WebSocketConfigurer {

@Autowired
private WebSocketHandler webSocketHandler;

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


- ScsWebSocketHandler.java
import java.util.ArrayList;
import java.util.List;

import org.springframework.stereotype.Component;
import org.springframework.web.socket.CloseStatus;
import org.springframework.web.socket.TextMessage;
import org.springframework.web.socket.WebSocketSession;
import org.springframework.web.socket.handler.TextWebSocketHandler;

@Component
public class ScsWebSocketHandler extends TextWebSocketHandler {

private List<WebSocketSession> sessionList = new ArrayList<WebSocketSession>();

// 클라이언트가 연결 되었을 때 실행
@Override
public void afterConnectionEstablished(WebSocketSession session) throws Exception {
sessionList.add(session);
}

// 클라이언트가 웹소켓 서버로 메시지를 전송했을 때 실행
@Override
protected void handleTextMessage(WebSocketSession session, TextMessage message) throws Exception {
String payload = message.getPayload();
System.out.println("payload : " + payload);
// 모든 클라이언트에게 메시지 전송
for (WebSocketSession sess : sessionList) {
sess.sendMessage(new TextMessage(payload));
}
}

// 클라이언트 연결을 끊었을 때 실행
@Override
public void afterConnectionClosed(WebSocketSession session, CloseStatus status) throws Exception {
sessionList.remove(session);
}
}


- jsp
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>WebSocket Test</title>
<script>
document.addEventListener("DOMContentLoaded", function() {
var webSocket;
var messages = document.getElementById("messages");

function connect() {
// 현재 페이지의 호스트를 기준으로 WebSocket URL을 생성합니다.
var host = window.location.host;
var path = window.location.pathname.substring(0, window.location.pathname.lastIndexOf('/'));
var protocol = window.location.protocol === 'https:' ? 'wss://' : 'ws://';
var wsUri = protocol + host + "/webSocket.do";

webSocket = new WebSocket(wsUri);

webSocket.onopen = function(event) {
addMessage("WebSocket에 연결되었습니다.");
};

webSocket.onmessage = function(event) {
addMessage("서버로부터 메시지 수신: " + event.data);
};

webSocket.onclose = function(event) {
addMessage("WebSocket 연결이 끊겼습니다.");
};

webSocket.onerror = function(event) {
addMessage("오류 발생: " + event.data);
};
}

function sendMessage() {
var message = document.getElementById("messageInput").value;
if (webSocket && webSocket.readyState === WebSocket.OPEN) {
webSocket.send(message);
addMessage("나: " + message);
document.getElementById("messageInput").value = "";
} else {
addMessage("WebSocket이 연결되어 있지 않습니다.");
}
}

function addMessage(message) {
var messageElement = document.createElement("p");
messageElement.textContent = message;
messages.appendChild(messageElement);
messages.scrollTop = messages.scrollHeight;
}

document.getElementById("sendButton").addEventListener("click", sendMessage);

// Enter 키로 메시지 전송
document.getElementById("messageInput").addEventListener("keypress", function(e) {
if (e.key === 'Enter') {
sendMessage();
}
});

connect();
});
</script>
<style>
#messages {
width: 100%;
height: 300px;
border: 1px solid #ccc;
overflow-y: scroll;
padding: 10px;
box-sizing: border-box;
}
#messageInput {
width: calc(100% - 80px);
padding: 5px;
}
#sendButton {
width: 70px;
padding: 5px;
}
</style>
</head>
<body>
<h1>WebSocket 테스트</h1>
<div id="messages"></div>
<div>
<input type="text" id="messageInput" placeholder="메시지를 입력하세요...">
<button id="sendButton">전송</button>
</div>
</body>
</html>
수정목록