Merge pull request #145 from CS3219-AY2324S1/bryan/fix-socketio-nginx

Fix socket io namespace clash in production
CS3219-AY2324S1 · Oct 27, 2023 · 124a206 · 124a206
2 parents 62daf81 + 5beb7d4
commit 124a206
Show file tree

Hide file tree

Showing 4 changed files with 11 additions and 3 deletions.
diff --git a/.github/workflows/deploy-production.yml b/.github/workflows/deploy-production.yml
@@ -40,7 +40,7 @@ jobs:
           export REACT_APP_QUESTIONS_SERVICE_HOST=http://peerprep.bryanlohxz.com/api/questions-service
           export REACT_APP_USERS_SERVICE_HOST=http://peerprep.bryanlohxz.com/api/users-service
           export REACT_APP_MATCHMAKING_SERVICE_HOST=ws://peerprep.bryanlohxz.com/api/matchmaking-service
-          export REACT_APP_COLLABORATION_SERVICE_HOST=ws://peerprep.bryanlohxz.com/api/collaboration-service
+          export REACT_APP_COLLABORATION_SERVICE_HOST=http://peerprep.bryanlohxz.com
           export CI=false
           yarn build
       - name: Set up Git

diff --git a/collaboration-service/src/index.js b/collaboration-service/src/index.js
@@ -4,7 +4,10 @@ import NodeCache from "node-cache";
 import { Server } from "socket.io";
 
 const httpServer = createServer();
-const io = new Server(httpServer, { cors: { origin: "*" } });
+const io = new Server(httpServer, {
+  cors: { origin: "*" },
+  path: "/api/collaboration-service",
+});
 const roomQuestionsCache = new NodeCache();
 
 const clientEvents = {

diff --git a/compose.yml b/compose.yml
@@ -12,7 +12,7 @@ services:
       REACT_APP_QUESTIONS_SERVICE_HOST: http://localhost:3001
       REACT_APP_USERS_SERVICE_HOST: http://localhost:3002
       REACT_APP_MATCHMAKING_SERVICE_HOST: ws://localhost:3003
-      REACT_APP_COLLABORATION_SERVICE_HOST: ws://localhost:3004
+      REACT_APP_COLLABORATION_SERVICE_HOST: http://localhost:3004
     volumes:
       - ./frontend-service:/app
     command: yarn start

diff --git a/frontend-service/src/pages/Collaboration.js b/frontend-service/src/pages/Collaboration.js
@@ -61,6 +61,7 @@ const Collaboration = () => {
     const token = window.localStorage.getItem("token");
     const socket = io(`${process.env.REACT_APP_COLLABORATION_SERVICE_HOST}`, {
       query: { difficulty, roomId, token },
+      path: "/api/collaboration-service",
     });
     setSocket(socket);
 
@@ -92,6 +93,10 @@ const Collaboration = () => {
     socket.on("disconnect", () => {
       return navigate("/matchmaking");
     });
+
+    return async () => {
+      socket.disconnect();
+    };
   }, [navigate, searchParams]);
 
   useEffect(() => {