Merge pull request #157 from ets-cfuhrman-pfe/ssl-changes

Ssl changes (debugging, trying to make wss work in prod)

client/src/pages/Student/JoinRoom/JoinRoom.tsx

@@ -34,6 +34,7 @@ const JoinRoom: React.FC = () => {
     }, []);
 
     const handleCreateSocket = () => {
+        console.log(`JoinRoom: handleCreateSocket: ${ENV_VARIABLES.VITE_BACKEND_URL}`);
         const socket = webSocketService.connect(ENV_VARIABLES.VITE_BACKEND_URL);
 
         socket.on('join-success', () => {
@@ -63,10 +64,10 @@ const JoinRoom: React.FC = () => {
         socket.on('connect_error', (error) => {
             switch (error.message) {
                 case 'timeout':
-                    setConnectionError("Le serveur n'est pas disponible");
+                    setConnectionError("JoinRoom: timeout: Le serveur n'est pas disponible");
                     break;
                 case 'websocket error':
-                    setConnectionError("Le serveur n'est pas disponible");
+                    setConnectionError("JoinRoom: websocket error: Le serveur n'est pas disponible");
                     break;
             }
             setIsConnecting(false);

client/src/pages/Teacher/ManageRoom/ManageRoom.tsx

@@ -80,6 +80,7 @@ const ManageRoom: React.FC = () => {
     };
 
     const createWebSocketRoom = () => {
+        console.log('Creating WebSocket room...');
         setConnectingError('');
         const socket = webSocketService.connect(ENV_VARIABLES.VITE_BACKEND_URL);
 
@@ -88,7 +89,7 @@ const ManageRoom: React.FC = () => {
         });
         socket.on('connect_error', (error) => {
             setConnectingError('Erreur lors de la connexion... Veuillez réessayer');
-            console.error('WebSocket connection error:', error);
+            console.error('ManageRoom: WebSocket connection error:', error);
         });
         socket.on('create-success', (roomName: string) => {
             setRoomName(roomName);

client/src/services/WebsocketService.tsx

@@ -21,11 +21,18 @@ class WebSocketService {
     private socket: Socket | null = null;
 
     connect(backendUrl: string): Socket {
-        // console.log(backendUrl);
-        this.socket = io(`${backendUrl}`, {
+        console.log(`WebSocketService.connect(${backendUrl})`);
+
+        // Ensure the URL uses wss: if the page is loaded over https:
+        const protocol = window.location.protocol === 'https:' ? 'wss:' : 'ws:';
+        const url = backendUrl.replace(/^http:/, protocol);
+        console.log(`WebSocketService.connect: changed url=${url}`);
+
+        this.socket = io(url, {
             transports: ['websocket'],
             reconnectionAttempts: 1
         });
+
         return this.socket;
     }
 

server/app.js

@@ -69,8 +69,11 @@ let isDev = process.env.NODE_ENV === 'development';
 console.log(`Environnement: ${process.env.NODE_ENV} (${isDev ? 'dev' : 'prod'})`);
 
 const io = configureServer(server);
+console.log(`server.io configured: ${io.secure ? 'secure' : 'not secure'}`);
 
 setupWebsocket(io);
+console.log(`Websocket setup with on() listeners.`);
+
 app.use(cors());
 app.use(bodyParser.urlencoded({ extended: true }));
 app.use(bodyParser.json());

server/socket/socket.js

@@ -16,12 +16,12 @@ const setupWebsocket = (io) => {
     }
 
     totalConnections++;
-    // console.log(
-    //   "A user connected:",
-    //   socket.id,
-    //   "| Total connections:",
-    //   totalConnections
-    // );
+    console.log(
+      "A user connected:",
+      socket.id,
+      "| Total connections:",
+      totalConnections
+    );
 
     socket.on("create-room", (sentRoomName) => {
       if (sentRoomName) {