Golang WASM Demo

Golang 1.11 加入了对 WebAssembly 的支持，以下会测试并运行一个简单的 Demo。

  1. 编写测试代码并编译为 WASM 二进制代码
  2. 编写 WebServer 代码用于正确加载本地 WASM 文件
  3. 使用 Golang 编写好的 HTML 和 JavaScript 加载 WASM
  4. 使用浏览器测试代码

编译测试代码

1// 测试代码 main.go
2package main
3
4import "fmt"
5
6func main() {
7    fmt.Println("hello, Go/WASM!")
8}

1# 编译命令 修改编译好的文件名称为 test.wasm 以便被自带的 HTML 文件正确加载
2$ GOOS=js GOARCH=wasm go build -o test.wasm main.go

编写 WebServer 代码

 1// server.go
 2package main
 3
 4import (
 5    "flag"
 6    "log"
 7    "net/http"
 8)
 9
10func main() {
11    port := flag.String("port", "8000", "port")
12    flag.Parse()
13    log.Fatal(http.ListenAndServe(":"+*port, http.FileServer(http.Dir("."))))
14}

拷贝 Golang 自带的测试文件

1# /usr/local/go 是 Golang 根目录 (GOROOT)
2$ cp /usr/local/go/misc/wasm/wasm_exec.{html,js} ./

在浏览器测试代码

1# 启动 WebServer
2$ go run server.go

打开测试网页 localhost:8000/wasm_exec.html，会看到一个 run 按钮

点击按钮，在浏览器控制台将会看到 hello, Go/WASM! 字符串，代表代码正确运行

参考 & 扩展