fix: auto-connect ws server

src/assets/autoreload.js

@@ -1,24 +1,22 @@
 (function () {
-  var protocol = window.location.protocol === "https:" ? "wss:" : "ws:";
+  var protocol = window.location.protocol === 'https:' ? 'wss:' : 'ws:';
-
+  var url = protocol + '//' + window.location.host + '/_dioxus/ws';
-  var url = protocol + "//" + window.location.host + "/_dioxus/ws";
+  var poll_interval = 8080;
-
+  var reload_upon_connect = () => {
-  var poll_interval = 2000;
+      window.setTimeout(
+          () => {
+              var ws = new WebSocket(url);
+              ws.onopen = () => window.location.reload();
+              ws.onclose = reload_upon_connect;
+          },
+          poll_interval);
+  };
 
   var ws = new WebSocket(url);
-
+  ws.onmessage = (ev) => {
-  ws.addEventListener("message", (ev) => {
       if (ev.data == "reload") {
           window.location.reload();
       }
-  });
+  };
-  
+  ws.onclose = reload_upon_connect;
-  ws.addEventListener("open", () => {
+})()
-    ws.send("init");
-  });
-
-  ws.addEventListener("close", () => {
-    alert("Dev-Server Socket Closed.");
-  });
-
-})();

src/server/mod.rs

@@ -36,6 +36,7 @@ pub async fn startup(config: CrateConfig) -> anyhow::Result<()> {
         .watch_path
         .clone()
         .unwrap_or_else(|| vec![PathBuf::from("src")]);
+
     for sub_path in allow_watch_path {
         watcher
             .watch(
@@ -46,13 +47,15 @@ pub async fn startup(config: CrateConfig) -> anyhow::Result<()> {
     }
 
     let (reload_tx, _) = broadcast::channel(100);
-    let ws_reload_state = Arc::new(WsRelodState { update: reload_tx });
+
+    let ws_reload_state = Arc::new(WsRelodState {
+        update: reload_tx.clone(),
+    });
 
     let watcher_conf = config.clone();
-    let watcher_ws_state = ws_reload_state.update.clone();
+
     tokio::spawn(async move {
-        loop {
+        while let Ok(v) = watcher_rx.recv() {
-            if let Ok(v) = watcher_rx.recv() {
             match v {
                 DebouncedEvent::Create(_)
                 | DebouncedEvent::Write(_)
@@ -70,17 +73,21 @@ pub async fn startup(config: CrateConfig) -> anyhow::Result<()> {
                         {
                             let _ = Serve::regen_dev_page(&watcher_conf);
                         }
-                            println!("send reload!");
+                        reload_tx.send("reload".into()).unwrap();
-                            watcher_ws_state.send("reload".into()).unwrap();
                     }
                 }
                 _ => {}
             }
         }
-        }
     });
 
-    let app = Router::new()
+    // start serve dev-server at 0.0.0.0:8080
+    let port = "8080";
+    log::info!("📡 Dev-Server is started at: http://127.0.0.1:{}/", port);
+
+    axum::Server::bind(&format!("0.0.0.0:{}", port).parse().unwrap())
+        .serve(
+            Router::new()
                 .route("/_dioxus/ws", get(ws_handler))
                 .fallback(
                     get_service(ServeDir::new(config.crate_dir.join(&dist_path))).handle_error(
@@ -92,14 +99,11 @@ pub async fn startup(config: CrateConfig) -> anyhow::Result<()> {
                         },
                     ),
                 )
-        .layer(AddExtensionLayer::new(ws_reload_state.clone()));
+                .layer(AddExtensionLayer::new(ws_reload_state))
-
+                .into_make_service(),
-    // start serve dev-server at 0.0.0.0:8080
+        )
-    let port = "8080";
-    log::info!("📡 Dev-Server is started at: http://127.0.0.1:{}/", port);
-    axum::Server::bind(&format!("0.0.0.0:{}", port).parse().unwrap())
-        .serve(app.into_make_service())
         .await?;
+
     Ok(())
 }
 
@@ -109,10 +113,13 @@ async fn ws_handler(
     Extension(state): Extension<Arc<WsRelodState>>,
 ) -> impl IntoResponse {
     ws.on_upgrade(|mut socket| async move {
+
+        log::info!("New websocket conenct.");
+
         let mut rx = state.update.subscribe();
+
         loop {
-            println!("wait");
+            let v = rx.recv().await.unwrap();
-            if let Ok(v) = rx.recv().await {
             println!("trigger recv: {}", v);
             if v == "reload" {
                 // ignore the error
@@ -121,12 +128,10 @@ async fn ws_handler(
                     .await
                     .is_err()
                 {
+                    println!("send failed");
                     return;
                 }
             }
-            } else {
-                println!("SS");
-            }
         }
     })
 }