Merge pull request #749 from Demonthos/keep-websocket-alive

Keep LiveView web socket alive

packages/liveview/src/main.js

@@ -12,7 +12,13 @@ class IPC {
 
     let ws = new WebSocket(WS_ADDR);
 
+    function ping() {
+      ws.send("__ping__");
+    }
+
     ws.onopen = () => {
+      // we ping every 30 seconds to keep the websocket alive
+      setInterval(ping, 30000);
       ws.send(serializeIpcMessage("initialize"));
     };
 
@@ -21,8 +27,14 @@ class IPC {
     };
 
     ws.onmessage = (event) => {
-      let edits = JSON.parse(event.data);
-      window.interpreter.handleEdits(edits);
+      // Ignore pongs
+      if (event.data != "__pong__") {
+        let edits = JSON.parse(event.data);
+        window.interpreter.handleEdits(edits);
+      }
+      else {
+        console.log("ponged");
+      }
     };
 
     this.ws = ws;

packages/liveview/src/pool.rs

@@ -127,9 +127,13 @@ where
             _ = vdom.wait_for_work() => {}
 
             evt = ws.next() => {
-                match evt {
+                match evt.as_ref().map(|o| o.as_deref()) {
+                    // respond with a pong every ping to keep the websocket alive
+                    Some(Ok("__ping__")) => {
+                        ws.send("__pong__".to_string()).await?;
+                    }
                     Some(Ok(evt)) => {
-                        if let Ok(IpcMessage { params }) = serde_json::from_str::<IpcMessage>(&evt) {
+                        if let Ok(IpcMessage { params }) = serde_json::from_str::<IpcMessage>(evt) {
                             vdom.handle_event(&params.name, params.data.into_any(), params.element, params.bubbles);
                         }
                     }