serialize data in the server and deserialize data in the client

packages/fullstack/Cargo.toml

@@ -69,7 +69,6 @@ dioxus-cli-config = { workspace = true, optional = true }
 [target.'cfg(not(target_arch = "wasm32"))'.dependencies]
 dioxus-hot-reload = { workspace = true }
 
-
 [features]
 default = ["hot-reload"]
 hot-reload = ["serde_json", "futures-util"]

packages/fullstack/examples/axum-hello-world/Cargo.toml

@@ -17,5 +17,5 @@ reqwest = "0.11.18"
 
 [features]
 default = []
-ssr = ["dioxus/axum"]
+server = ["dioxus/axum"]
 web = ["dioxus/web"]

packages/fullstack/examples/axum-hello-world/src/main.rs

@@ -11,6 +11,7 @@ use serde::{Deserialize, Serialize};
 fn app() -> Element {
     let mut count = use_signal(|| 0);
     let text = use_signal(|| "...".to_string());
+    let server_future = use_server_future(get_server_data)?;
 
     rsx! {
         h1 { "High-Five counter: {count}" }
@@ -30,6 +31,7 @@ fn app() -> Element {
             "Run a server function!"
         }
         "Server said: {text}"
+        "{server_future.state():?}"
     }
 }
 

packages/fullstack/src/hooks/server_future.rs

@@ -10,7 +10,7 @@ where
     F: Future<Output = T> + 'static,
 {
     let mut cb = use_callback(_future);
-    let mut gen = use_hook(|| CopyValue::new(0));
+    let mut first_run = use_hook(|| CopyValue::new(true));
 
     let resource = use_resource(move || {
         async move {
@@ -18,11 +18,13 @@ where
             // We're doing this regardless so inputs get tracked, even if we drop the future before polling it
             let user_fut = cb.call();
 
-            // If this is the first run, the data might be cached
+            // If this is the first run and we are on the web client, the data might be cached
-            if gen() == 0 {
+            if *first_run.peek() {
-                #[cfg(not(feature = "web"))]
+                // This is no longer the first run
+                first_run.set(false);
+
+                #[cfg(feature = "web")]
                 if let Some(o) = crate::html_storage::deserialize::take_server_data::<T>() {
-                    gen.set(1);
                     return o;
                 }
             }
@@ -30,28 +32,28 @@ where
             // Otherwise just run the future itself
             let out = user_fut.await;
 
-            // and push the gen forward
+            // If this is the first run and we are on the server, cache the data
-            gen.set(1);
+            #[cfg(feature = "ssr")]
+            if *first_run.peek() {
+                let _ = crate::server_context::server_context().push_html_data(&out);
+            }
 
+            #[allow(clippy::let_and_return)]
             out
         }
     });
 
     // On the first run, force this task to be polled right away in case its value is ready
     use_hook(|| {
-        let _ = resource.task().unwrap().poll_now();
+        let _ = resource.task().poll_now();
     });
 
     // Suspend if the value isn't ready
-    match resource.state() {
+    match resource.state().cloned() {
         UseResourceState::Pending => {
             suspend();
             None
         }
-        UseResourceState::Regenerating => {
+        _ => Some(resource),
-            suspend();
-            Some(resource)
-        }
-        UseResourceState::Ready => Some(resource),
     }
 }

packages/fullstack/src/html_storage/deserialize.rs

@@ -26,7 +26,7 @@ pub(crate) fn serde_from_bytes<T: DeserializeOwned>(string: &[u8]) -> Option<T>
 
 static SERVER_DATA: once_cell::sync::Lazy<Option<HTMLDataCursor>> =
     once_cell::sync::Lazy::new(|| {
-        #[cfg(target_arch = "wasm32")]
+        #[cfg(all(feature = "web", target_arch = "wasm32"))]
         {
             let window = web_sys::window()?.document()?;
             let element = match window.get_element_by_id("dioxus-storage-data") {
@@ -48,7 +48,7 @@ static SERVER_DATA: once_cell::sync::Lazy<Option<HTMLDataCursor>> =
 
             Some(data.cursor())
         }
-        #[cfg(not(target_arch = "wasm32"))]
+        #[cfg(not(all(feature = "web", target_arch = "wasm32")))]
         {
             None
         }
@@ -63,11 +63,7 @@ pub(crate) fn take_server_data<T: DeserializeOwned>() -> Option<T> {
 ///
 /// When dioxus-fullstack renders the page, it will serialize the root props and put them in the document. This function gets them from the document.
 pub fn get_root_props_from_document<T: DeserializeOwned>() -> Option<T> {
-    #[cfg(not(target_arch = "wasm32"))]
+    #[cfg(all(feature = "web", target_arch = "wasm32"))]
-    {
-        None
-    }
-    #[cfg(target_arch = "wasm32")]
     {
         let attribute = web_sys::window()?
             .document()?
@@ -76,4 +72,8 @@ pub fn get_root_props_from_document<T: DeserializeOwned>() -> Option<T> {
 
         serde_from_bytes(attribute.as_bytes())
     }
+    #[cfg(not(all(feature = "web", target_arch = "wasm32")))]
+    {
+        None
+    }
 }