■ 웹 어셈블리를 만드는 방법을 보여준다.
▶ Cargo.toml
1 2 3 4 5 6 7 8 9 10 11 12 |
[package] name = "test_library" version = "0.1.0" edition = "2021" [lib] crate-type = ["cdylib", "rlib"] [dependencies] wasm-bindgen = "0.2" |
▶ src/lib.rs
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 |
extern crate wasm_bindgen; use wasm_bindgen::prelude::*; #[wasm_bindgen] extern { pub fn alert(message : &str); } #[wasm_bindgen] pub fn print_message(message : &str) { let target_message : String = format!("Hello, {}!", message); alert(&target_message); } #[wasm_bindgen] pub fn multiply(value1 : i32, value2 : i32) -> i32 { return value1 * value2; } |
▶ index.html
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 |
<!DOCTYPE html> <html> <meta charset="utf-8"> <body> <script type="module"> import init, {print_message, multiply} from './pkg/test_library.js'; init().then ( () => { setTimeout ( () => { print_message('Rust'); }, 300 ); const value = multiply(2000, 3); document.getElementById('info').innerHTML = value; } ); </script> <h1>index.html</h1> <h2 id="info"></h2> </body> </html> |
※ 참고 사항
1. wasm-pack이 설치되어 있어야 한다.
2. cargo run 또는 cargo build 명령이 아니라 wasp-pack build 명령으로 컴파일을 해야 한다.
3. 웹 서버에 wasm MIME 타입을 등록해야 한다.
4. 2번이 성공적으로 실행되면 pkg 폴더가 생성되는데 pkg 폴더를 웹 서버의 적절한 디렉토리에 복사한다.