I got a 404 in my page when I click back in my browser

[QuintinTao]

I built a website with leptos.
Here is my critical code of the page

      <div class="flex items-center pb-6">
        <img src="/assets/img/icon-project.png" alt="icon story" />
        <h3 class="ml-3 font-body text-2xl font-semibold text-primary dark:text-white">
          "My Projects"
        </h3>
      </div>
      <div>
      <Transition fallback=move || view! {<p>"Loading projects"</p> }>
        // handles the error from the resource
            {move || {
                      match projects.get() {
                        None => {
                                   view! { <pre class="error">"Server Error: "</pre>}.into_view()
                        },
                        Some(s) => {
                          match s {
                            Err(e) => {
                                    view! { <pre class="error">"Server Error: " {e.to_string()}</pre>}.into_view()
                            },
                            Ok(t) => t.into_iter().map(|data|{
                                      view! {
                                                  <a href=" / " class="mb-6 flex items-center justify-between border border-grey-lighter px-4 py-4 sm:px-6">
                                                  <span class="w-9/10 pr-8">
                                                    <h4 class="font-body text-lg font-semibold text-primary dark:text-white">
                                                      {data.title}
                                                    </h4>
                                                    <p class="font-body font-light text-primary dark:text-white">
                                                      {data.describe}
                                                    </p>
                                                  </span>
                                                  <span class="w-1/10">
                                                    <img src="/assets/img/chevron-right.png" class="mx-auto" alt="chevron right" />
                                                  </span>
                                                 </a>
                                       }
                                      }).collect_view()

                        }
                        }
                      }
            }}
    </Transition>
      </div>
    </div>

  </div>
</div>

#[server(GetProjects, "/project")]
pub async fn get_projects() -> Result<Vec, ServerFnError> {
use crate::dao::*;
let req = use_context::<actix_web::HttpRequest>();
if let Some(req) = req {
println!("req.path = {:#?}", req.path());
}
use futures::TryStreamExt;
let mut conn = db().await?;

let mut todos = Vec::new();
let mut rows =
sqlx::query_as::<_, Project>("select * from tb_project limit 10").fetch(&mut conn);
while let Some(row) = rows.try_next().await? {
println!("{}", &row.title);
todos.push(row);
}
Ok(todos)
}

I can get the list when I visit the first page of the website. But when I click other pages and click back in my browser. I can't get the list.

initialization

after click “back”

[basro]

The code you shared is insufficient, how is the projects variable defined?

[QuintinTao]

hi，you mean Cargo.toml ？
[package]
name = "leptos-new"
version = "0.1.0"
edition = "2021"
[lib]
crate-type = ["cdylib", "rlib"]

[dependencies]
actix-files = { version = "0.6", optional = true }
actix-web = { version = "4", optional = true, features = ["macros"] }
futures = "0.3.25"
console_error_panic_hook = "0.1"
cfg-if = "1"
http = { version = "0.2", optional = true }
leptos = { version = "0.5", features = ["nightly"] }
leptos_meta = { version = "0.5", features = ["nightly"] }
leptos_actix = { version = "0.5", optional = true }
leptos_router = { version = "0.5", features = ["nightly"] }

minify-html-common = "0.0.2"
once_cell = "1.13.0"
toml = "0.8.8"
snafu = { version ="0.8.0", features = [ "std", "futures", "guide" ]}

serde = { version = "1", features = ["derive"] }
serde_yaml = "0.8.13"
serde_json = "1.0.82"
validator = { version = "0.16.1", features = ["derive"] }
sqlx = { version = "0.7", features = [
"runtime-tokio-rustls",
"mysql",
], optional = true }
tokio = { version = "1", features = ["full"] , optional = true }
wasm-bindgen = "=0.2.89"

[features]
hydrate = ["leptos/hydrate", "leptos_meta/hydrate", "leptos_router/hydrate"]
ssr = [
"dep:actix-files",
"dep:actix-web",
"dep:sqlx",
"leptos/ssr",
"leptos_actix",
"leptos_meta/ssr",
"leptos_router/ssr",
"dep:tokio",
]

[package.metadata.cargo-all-features]

denylist = ["actix-files", "actix-web", "leptos_actix", "sqlx"]
skip_feature_sets = [["csr", "ssr"], ["csr", "hydrate"], ["ssr", "hydrate"]]

[package.metadata.leptos]
# The name used by wasm-bindgen/cargo-leptos for the JS/WASM bundle. Defaults to the crate name   
output-name = "leptos_start"
# The site root folder is where cargo-leptos generate all output. WARNING: all content of this folder will be erased on a rebuild. Use it in your server setup.
site-root = "target/site"
# The site-root relative folder where all compiled output (JS, WASM and CSS) is written
# Defaults to pkg	
site-pkg-dir = "pkg"
# [Optional] The source CSS file. If it ends with .sass or .scss then it will be compiled by dart-sass into CSS. The CSS is optimized by Lightning CSS before being written to <site-root>/<site-pkg>/app.css
tailwind-input-file = "style/tailwind.css"
# Assets source dir. All files found here will be copied and synchronized to site-root.
# The assets-dir cannot have a sub directory with the same name/path as site-pkg-dir.
#
# Optional. Env: LEPTOS_ASSETS_DIR.
assets-dir = "assets"
# The IP and port (ex: 127.0.0.1:3000) where the server serves the content. Use it in your server setup.
site-addr = "127.0.0.1:3000"
# The port to use for automatic reload monitoring
reload-port = 3001
# [Optional] Command to use when running end2end tests. It will run in the end2end dir.
#   [Windows] for non-WSL use "npx.cmd playwright test"
#   This binary name can be checked in Powershell with Get-Command npx
end2end-cmd = "npx playwright test"
end2end-dir = "end2end"
#  The browserlist query used for optimizing the CSS.
browserquery = "defaults"
# Set by cargo-leptos watch when building with that tool. Controls whether autoreload JS will be included in the head
watch = false
# The environment Leptos will run in, usually either "DEV" or "PROD"
env = "DEV"
# The features to use when compiling the bin target
#
# Optional. Can be over-ridden with the command line parameter --bin-features
bin-features = ["ssr"]

# If the --no-default-features flag should be used when compiling the bin target
#
# Optional. Defaults to false.
bin-default-features = false

# The features to use when compiling the lib target
#
# Optional. Can be over-ridden with the command line parameter --lib-features
lib-features = ["hydrate"]

# If the --no-default-features flag should be used when compiling the lib target
#
# Optional. Defaults to false.
lib-default-features = false

# The profile to use for the lib target when compiling for release
#
# Optional. Defaults to "release".
lib-profile-release = "wasm-release"