1
0
mirror of https://github.com/google/comprehensive-rust.git synced 2025-05-22 18:30:33 +02:00

Use generic server

This commit is contained in:
sakex 2023-08-02 22:15:50 +02:00
parent 46c5a44040
commit 9f724d40ce
13 changed files with 281 additions and 1334 deletions

1272
Cargo.lock generated

File diff suppressed because it is too large Load Diff

View File

@ -5,6 +5,5 @@ members = [
"src/bare-metal/useful-crates/allocator-example", "src/bare-metal/useful-crates/allocator-example",
"src/bare-metal/useful-crates/zerocopy-example", "src/bare-metal/useful-crates/zerocopy-example",
"src/exercises/concurrency/chat-async", "src/exercises/concurrency/chat-async",
"src/rust-wasm-template/project", "src/rust-wasm-template",
"src/rust-wasm-template/server",
] ]

View File

@ -2,8 +2,8 @@
This repository contains the minimum amount of code needed to experiment with WebAssembly. Including a web server to serve the HTML and WASM as well as the javascript boilerplate needed to load WASM. This repository contains the minimum amount of code needed to experiment with WebAssembly. Including a web server to serve the HTML and WASM as well as the javascript boilerplate needed to load WASM.
- `/server` contains the Web server as well as the static files - `/static` contains the static files including compiled webassembly.
- `/project` contains the Rust code - `/src/lib.rs` contains the Rust code.
## Installation ## Installation
@ -29,21 +29,35 @@ Alternatively, see the [installation page](https://rustwasm.github.io/wasm-pack/
## Run the local server ## Run the local server
``` If you have python on your machine, you can simply
cd server
cargo run ```
cd rust-wasm-template/static
python3 -m http.server
``` ```
- On a devcontainer, go to `PORTS` and open the link under `Local Address` for Port `8080` Otherwise a Rust alternative exists and you can install it with
- Locally, visit http://localhost:8080
```
cargo install cargo server
```
And run
```
cd rust-wasm-template/static
cargo-server
```
- On a devcontainer, go to `PORTS` and open the link under `Local Address` for Port `8000`
- Locally, visit http://localhost:8000
## Build WASM and copy target to the correct path ## Build WASM and copy target to the correct path
``` ```
cd project wasm-pack build --target web --out-dir static/wasm
wasm-pack build --target web && cp -r pkg ../server
``` ```
This command needs to be re-run to view your latest changes. This command needs to be re-run to view your latest changes.

View File

@ -1,10 +0,0 @@
[package]
name = "server"
version = "0.1.0"
edition = "2021"
publish = false
[dependencies]
actix-web = "3.3.2"
actix-files = "0.5.0"

View File

@ -1,106 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>WebAssembly Template</title>
<style>
@font-face {
font-family: SourceCodePro;
src: url(/font.otf);
}
body {
background-color: #282c34;
font-family: "SourceCodePro";
}
h1 {
margin-left: 40px;
max-width: 530px;
color: #ca6568;
}
i {
color: #ca6568;
}
p, ul {
margin-left: 40px;
max-width: 530px;
text-align: justify;
color: #99a0ab;
}
li {
color: #ca6568;
background-color: #31363f;
margin-bottom: 20px;
max-width: 470px;
padding: 10px;
}
a {
color: #5fade9;
}
button {
background-color: #99a0ab;
width: 200px;
padding: 5px 0;
margin-left: calc(50% - 100px - 11px);
border-radius: 5px;
border: 0;
cursor: pointer;
transition: 1s;
}
button:hover {
background-color: #282c34;
color: white;
}
input, select {
width: 150px;
padding: 5px;
background-color: #31363f;
border: 1px solid #99a0ab;
color: #99a0ab;
border-radius: 4px;
}
#wasmoutput {
background-color: aliceblue;
color: #282c34;
padding: 10px;
border-radius: 5px;
font-weight: bold;
cursor: pointer;
display: inline-block;
min-height: 1em;
min-width: 1em;
}
img {
width: 300px;
height: 300px;
object-fit: contain;
}
</style>
</head>
<body>
<h1>
WebAssembly Template
</h1>
<p>
This repository contains the minimum amount of code needed to experiment with WebAssembly. Including a web server to serve the HTML and WASM as well as the javascript boilerplate needed to load WASM.
</p>
<p>
Edit <a href="https://github.com/google/comprehensive-rust/tree/main/src/rust-wasm-template/server/files/index.mjs">server/files/index.mjs</a> to edit the Javascript.
</p>
<p>
WASM output: <span id="wasmoutput" />
</p>
<script type="module" src="/files/index.mjs"></script>
</body>
</html>

View File

@ -1,50 +0,0 @@
use actix_files::NamedFile;
use actix_web::{get, web, App, HttpServer, Result};
use std::path::PathBuf;
#[get("/")]
async fn index() -> Result<NamedFile> {
let path: PathBuf = "./files/index.html".parse()?;
Ok(NamedFile::open(path)?.use_last_modified(true))
}
#[get("/files/{name}")]
async fn files(web::Path(name): web::Path<String>) -> Result<NamedFile> {
let path: PathBuf = format!("./files/{}", name).parse()?;
Ok(NamedFile::open(path)?.use_last_modified(true))
}
#[get("/font.otf")]
async fn font() -> Result<NamedFile> {
let path: PathBuf = "./files/source-code-regular.otf".parse()?;
Ok(NamedFile::open(path)?.use_last_modified(true))
}
#[get("/wasm/{name}")]
async fn serve_wasm(web::Path(name): web::Path<String>) -> Result<NamedFile> {
let path: PathBuf = format!("./pkg/{}", name).parse()?;
Ok(NamedFile::open(path)?.use_last_modified(true))
}
#[get("/wasm/snippets/{snippet_name}/{name}")]
async fn serve_wasm_snippet(
web::Path((snippet_name, name)): web::Path<(String, String)>,
) -> Result<NamedFile> {
let path: PathBuf = format!("./pkg/snippets/{}/{}", snippet_name, name).parse()?;
Ok(NamedFile::open(path)?.use_last_modified(true))
}
#[actix_web::main]
async fn main() -> std::io::Result<()> {
HttpServer::new(|| {
App::new()
.service(index)
.service(files)
.service(serve_wasm)
.service(serve_wasm_snippet)
.service(font)
})
.bind("127.0.0.1:8080")?
.run()
.await
}

View File

@ -0,0 +1,82 @@
@font-face {
font-family: SourceCodePro;
src: url(/source-code-regular.otf);
}
body {
background-color: #282c34;
font-family: "SourceCodePro";
}
h1 {
margin-left: 40px;
max-width: 530px;
color: #ca6568;
}
i {
color: #ca6568;
}
p, ul {
margin-left: 40px;
max-width: 530px;
text-align: justify;
color: #99a0ab;
}
li {
color: #ca6568;
background-color: #31363f;
margin-bottom: 20px;
max-width: 470px;
padding: 10px;
}
a {
color: #5fade9;
}
button {
background-color: #99a0ab;
width: 200px;
padding: 5px 0;
margin-left: calc(50% - 100px - 11px);
border-radius: 5px;
border: 0;
cursor: pointer;
transition: 1s;
}
button:hover {
background-color: #282c34;
color: white;
}
input, select {
width: 150px;
padding: 5px;
background-color: #31363f;
border: 1px solid #99a0ab;
color: #99a0ab;
border-radius: 4px;
}
#wasmoutput {
background-color: aliceblue;
color: #282c34;
padding: 10px;
border-radius: 5px;
font-weight: bold;
cursor: pointer;
display: inline-block;
min-height: 1em;
min-width: 1em;
}
img {
width: 300px;
height: 300px;
object-fit: contain;
}

View File

@ -0,0 +1,24 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>WebAssembly Template</title>
<link rel="stylesheet" href="/index.css">
</head>
<body>
<h1>
WebAssembly Template
</h1>
<p>
This repository contains the minimum amount of code needed to experiment with WebAssembly. Including a web server to serve the HTML and WASM as well as the javascript boilerplate needed to load WASM.
</p>
<p>
Edit <a href="https://github.com/google/comprehensive-rust/tree/main/src/rust-wasm-template/static/index.mjs">server/files/index.mjs</a> to edit the Javascript.
</p>
<p>
WASM output: <span id="wasmoutput" />
</p>
<script type="module" src="/index.mjs"></script>
</body>
</html>

View File

@ -2,24 +2,44 @@
## Commands to run: ## Commands to run:
### Compile Rust lib to WASM
You can compile the basic WASM library provided in [rust-wasm-template](https://github.com/google/comprehensive-rust/tree/main/src/rust-wasm-template) with this command: You can compile the basic WASM library provided in [rust-wasm-template](https://github.com/google/comprehensive-rust/tree/main/src/rust-wasm-template) with this command:
```shell ```shell
cd src/rust-wasm-template/project cd src/rust-wasm-template
wasm-pack build --target web && cp -r pkg ../server wasm-pack build --target web --out-dir static/wasm
``` ```
You can start the web server provided in [rust-wasm-template](https://github.com/google/comprehensive-rust/tree/main/src/rust-wasm-template) with this command: ### Serve static files
Webassembly has to be loaded from an HTTP server in order to be loaded on the brower.
```shell If you have python on your machine, you can simply
cd src/rust-wasm-template/server
cargo run ```
cd rust-wasm-template/static
python3 -m http.server
``` ```
Open the web page on port `8080`. HTML and JS files are provided at [rust-wasm-template/server](https://github.com/google/comprehensive-rust/tree/main/src/rust-wasm-template/server/files). Otherwise a Rust alternative exists and you can install it with
```
cargo install cargo server
```
And run
```
cd rust-wasm-template/static
cargo-server
```
Open the web page on port `8000`. HTML and JS files are provided at [rust-wasm-template/static](https://github.com/google/comprehensive-rust/tree/main/src/rust-wasm-template/static).
## Javascript ## Javascript