250x250
반응형
arkhyeon
arkhyeon
arkhyeon
전체 방문자
오늘
어제
  • 분류 전체보기 (88)
    • Spring (5)
    • Java (4)
    • React (25)
      • TypeScript (6)
      • JavaScript (1)
      • Jest (9)
    • NEXT (8)
    • SQL (1)
    • React native (1)
    • CSS (3)
    • Web (1)
    • Git (3)
    • ETC (6)
    • 빅데이터DB (8)
    • Docker (4)
    • Tool (1)

블로그 메뉴

  • 홈
  • 태그
  • 방명록

공지사항

인기 글

태그

  • react usetransition
  • react19
  • react loading
  • WSS
  • kudu
  • docker tomcat
  • websocket server
  • react
  • javasciprt websocket
  • javascript wss
  • react websocket
  • node WebSocket
  • jest
  • react typescript
  • react jest
  • usetransition
  • HIVE
  • Spring WebSocket
  • react spring websocket
  • websocket

최근 댓글

최근 글

티스토리

hELLO · Designed By 정상우.
arkhyeon

arkhyeon

Spring

Spring WebSocket Server - React

2023. 10. 31. 11:31
728x90
반응형

WebSocketChat.java

WebSocket의 열고, 닫고, 메세지 받을 때 어떻게 동작할 지 작성

 

WebSocketConfiguration.java

Spring Bean은 싱글톤으로 관리하지만 @ServerEndpoint 어노테이션인 클래스는 WebSocket 생성 시 마다 인스턴스가 생성되고 JWA에 의해 관리되기에 스프링의 @Autowired가 설정된 멤버들이 정상적으로 초기화 되지 않습니다. 이때 이를 연결해주고 초기화해주는 클래스가 필요합니다.

 

  • Spring Bean은 인스턴스 생성부터 소멸까지 인스턴스 생명주기 관리를 해주는 컨테이너의 자바 객체
  • 싱글톤 패턴은 애플리케이션이 시작 될 때 static을 통해 인스턴스를 메모리에 딱 하나 할당하고, 이후 호출 시 마다 해당 인스턴스를 반환해주는 디자인 패턴
  • JWA는 WAS에 설치되어 동작하는 어플리케이션
  • WAS는 DB 조회나 다양한 로직 처리를 요구하는 동적인 컨텐츠를 제공하기 위해 만들어진 Application으로 HTML, CSS, 이미지, 자바로 작성된 클래스(Servlet포함 package, interface 등), 각종 설정 파일 등 포함
// 클라이언트 연결 및  onopen 함수와 맵핑
@OnOpen
public void onOpen(Session session) {}

// 클라이언트의 send로 받은 메시지 및 onmessage 함수와 맵핑
@OnMessage
public void onMessage(String message, Session session) throws IOException {}

// 클라이언트 웹소켓 종료 및 onclose 함수와 맵핑
@OnClose
public void onClose(Session session) {}

 

WebMvcConfig.java

CORS 정책 설정

 

 

React Javascript WebSocket - Server 포함

ws 프로토콜 기반으로 클라이언트와 서버 사이에 지속적인 양방향 연결 스트림을 만들어 주는 기술 WebSocket 연결 브라우저에서 WebSocket 제공 시간이 걸리니 useEffect 내에서 연결 WebScoket은 꼭 전역

arkhyeon.tistory.com

 

Node WebSocket Server

const {WebSocketServer} = require("ws"); const wss = new WebSocketServer({ port: 8080 }); //연결 wss.on('connection', function connection(ws, request) { wss.clients.forEach(client => { client.send(`새로운 유저가 접속했습니다. 현재 유저 ${

arkhyeon.tistory.com

 

GitHub - arkhyeon/WebSocket

Contribute to arkhyeon/WebSocket development by creating an account on GitHub.

github.com

 

728x90
반응형

'Spring' 카테고리의 다른 글

프론트엔드 개발자 API 서버 열기 Spring Java Redis PostgreSQL  (0) 2024.03.12
Could not resolve org.springframework.boot:spring-boot-gradle-plugin:3.0.1.  (0) 2024.03.05
Maven & Gradle  (0) 2022.06.16
Maven & Gradle  (0) 2022.05.24
    'Spring' 카테고리의 다른 글
    • 프론트엔드 개발자 API 서버 열기 Spring Java Redis PostgreSQL
    • Could not resolve org.springframework.boot:spring-boot-gradle-plugin:3.0.1.
    • Maven & Gradle
    • Maven & Gradle
    arkhyeon
    arkhyeon

    티스토리툴바