From 1e159bb6822dd228a75cb31ce8e9c9fd765b0662 Mon Sep 17 00:00:00 2001
From: happyhyep <jhi2359@naver.com>
Date: Tue, 19 Nov 2024 00:09:03 +0900
Subject: [PATCH] =?UTF-8?q?[BE][Feat]=20#40=20:=20websocket=20=EC=97=B0?=
 =?UTF-8?q?=EA=B2=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- websocket 연결
- websocket 연결 테스트
---
 backend/src/index.js           |  2 +-
 backend/src/websocketServer.js | 19 ++++++++++++++++---
 frontend/vite.config.ts        |  3 +++
 3 files changed, 20 insertions(+), 4 deletions(-)

diff --git a/backend/src/index.js b/backend/src/index.js
index 355e0673..055aa8d3 100644
--- a/backend/src/index.js
+++ b/backend/src/index.js
@@ -26,6 +26,6 @@ try {
   console.error('Failed to initialize WebSocket server:', error);
 }
 
-app.listen(PORT, () => {
+server.listen(PORT, () => {
   console.log(`Server is running on http://localhost:${PORT}`);
 });
diff --git a/backend/src/websocketServer.js b/backend/src/websocketServer.js
index af63b040..bfc003c9 100644
--- a/backend/src/websocketServer.js
+++ b/backend/src/websocketServer.js
@@ -3,7 +3,20 @@ import { WebSocketServer } from 'ws';
 const activeConnections = {}; // token별로 연결을 관리하기 위한 객체
 
 export const initializeWebSocketServer = server => {
-  const wss = new WebSocketServer({ server });
+  const wss = new WebSocketServer({
+    server,
+    verifyClient: (info, done) => {
+      const { origin } = info;
+      if (origin === 'http://localhost:5173') {
+        done(true);
+      } else {
+        done(false, 403, 'Forbidden: Origin not allowed');
+      }
+    },
+  });
+  wss.on('error', err => {
+    console.error('WebSocket Server Error:', err);
+  });
 
   wss.on('connection', (ws, req) => {
     // URL에서 token 추출
@@ -27,7 +40,7 @@ export const initializeWebSocketServer = server => {
     console.log(`Client connected with token: ${token}`);
 
     // 클라이언트로부터 메시지 받았을 때의 이벤트 처리
-    ws.on('message', message => {
+    wss.on('message', message => {
       try {
         const data = JSON.parse(message); // 위치 데이터 수신
         if (data.latitude && data.longitude) {
@@ -44,7 +57,7 @@ export const initializeWebSocketServer = server => {
     });
 
     // 클라이언트 연결 종료 시
-    ws.on('close', (code, reason) => {
+    wss.on('close', (code, reason) => {
       console.log(`Client disconnected with token: ${token}, Code: ${code}, Reason: ${reason}`);
       // 연결이 종료되면 activeConnections에서 해당 token 제거
       delete activeConnections[token];
diff --git a/frontend/vite.config.ts b/frontend/vite.config.ts
index a7e44f41..345dbd45 100644
--- a/frontend/vite.config.ts
+++ b/frontend/vite.config.ts
@@ -5,4 +5,7 @@ import tsconfigPaths from 'vite-tsconfig-paths'; // 추가된 부분
 // https://vite.dev/config/
 export default defineConfig({
   plugins: [react(), tsconfigPaths()], // tsconfigPaths 플러그인 추가
+  server: {
+    hmr: false, // HMR 완전히 비활성화
+  },
 });