Dioxus minimal setup for TLS support

Readme.md

Dioxus TLS example server

Dioxus rely on Axum to manage https server in 0.6, here is a small setup to handle https support with .pem files

1. Create Dioxus project dx new demo and add dependencies and configuration from attached Cargo.toml
2. Generate some PEM files to target: openssl req -x509 -newkey rsa:4096 -keyout key.pem -out cert.pem -sha256
3. Copy content from main.rs
4. run dx bundle --platform web to generate target bundle
5. call generated server with environment variable path to certificate (cert.pem, key.pem in this example)

# from project directory
APP_CERT_DIR=./ ./target/dx/demo/release/web/server

Cargo.toml

[package]
name = "demo"
version = "0.1.0"
authors = ["Busyvar"]
edition = "2021"

# See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html

[dependencies]
axum = { version="0.7.9", optional= true }
dioxus-cli-config = { version = "*", optional = true }
axum-server = { version = "0.7.2", features = ["tls-openssl"], optional= true}
dioxus = { version = "0.6.0", features = ["fullstack"] }
tokio = { version = "1.0", features = ["full"], optional = true }

[features]
default = []
web = ["dioxus/web"]
server = ["dioxus/server", "dep:axum", "dep:axum-server", "dep:tokio", "dioxus-cli-config"] 
desktop = ["dioxus/desktop"]
mobile = ["dioxus/mobile"]

[profile]

[profile.wasm-dev]
inherits = "dev"
opt-level = 1

[profile.server-dev]
inherits = "dev"

[profile.android-dev]
inherits = "dev"

main.rs

use dioxus::prelude::*;

// The entry point for the production server (with TLS support)
#[cfg(all(feature = "server", not(debug_assertions)))]
#[tokio::main]
async fn main() {
use axum::ServiceExt;
use axum::{routing::get, Router};
use axum_server::tls_openssl::OpenSSLConfig;
use std::env;
use std::net::SocketAddr;
    // Get the address the server should run on. If the CLI is running, the CLI proxies fullstack into the main address
    // and we use the generated address the CLI gives us
    let address = dioxus::cli_config::fullstack_address_or_localhost();

    // Set up the axum router
    let router = axum::Router::new()
        // You can add a dioxus application to the router with the `serve_dioxus_application` method
        // This will add a fallback route to the router that will serve your component and server functions
        .serve_dioxus_application(ServeConfigBuilder::default(), App);

    let certs_path = env::var("APP_CERT_DIR").unwrap_or_else(|_| "./certs".into());
    let config = OpenSSLConfig::from_pem_file(
            format!("{}/cert.pem", certs_path).as_str(),
            format!("{}/key.pem", certs_path).as_str(),
        ).expect("Server require valid certificate to run");


    // Finally, we can launch the server
    let app = router.into_service();
    // let listener = tokio::net::TcpListener::bind(address).await.unwrap();
    // axum::serve(listener, router).await.unwrap();

    println!("Serving route for:{address}");
    axum_server::bind_openssl(address, config)
            .serve(app.into_make_service())
            .await
            .unwrap();
}

// For any other platform, we just launch the app
#[cfg(any(feature= "web", debug_assertions))] //to deliver
fn main() {
    dioxus::launch(App);
}
#[component]
pub fn App() -> Element {
    rsx! {"hello world"}
}