系列文章 Go WebAssembly 入門(一)
Getting Started
編寫main.go
package main
import (
"strconv"
"syscall/js"
)
// 傳入value1, value2, result三個(gè)元素的id敢朱,將value1+value2結(jié)果賦給result元素
func add(ids []js.Value) {
// 根據(jù)id獲取輸入值
value1 := js.Global().Get("document").Call("getElementById", ids[0].String()).Get("value").String()
value2 := js.Global().Get("document").Call("getElementById", ids[1].String()).Get("value").String()
int1, _ := strconv.Atoi(value1)
int2, _ := strconv.Atoi(value2)
// 將相加結(jié)果set給result元素
js.Global().Get("document").Call("getElementById", ids[2].String()).Set("value", int1+int2)
}
// 添加監(jiān)聽事件
func registerCallbacks() {
js.Global().Set("add", js.NewCallback(add))
}
func main() {
c := make(chan struct{}, 0)
println("Go WebAssembly Initialized!")
registerCallbacks()
<-c
}
將main.go編譯成lib.wasm
GOOS=js GOARCH=wasm go build -o lib.wasm main.go
在index.html中調(diào)用lib.wasm
<html>
<head>
<meta charset="utf-8">
<script src="wasm_exec.js"></script>
<script>
if (!WebAssembly.instantiateStreaming) { // polyfill
WebAssembly.instantiateStreaming = async (resp, importObject) => {
const source = await (await resp).arrayBuffer();
return await WebAssembly.instantiate(source, importObject);
};
}
const go = new Go();
let mod, inst;
WebAssembly.instantiateStreaming(fetch("lib.wasm"), go.importObject).then(async (result) => {
mod = result.module;
inst = result.instance;
await go.run(inst)
});
</script>
</head>
<body>
<input type="text" id="value1"/>
<input type="text" id="value2"/>
<button type="button" id="add" onClick="add('value1', 'value2', 'result');">add</button>
<input type="text" id="result"/>
</body>
</html>
打開server逻悠,在瀏覽器打開即可調(diào)用WebAssembly二進(jìn)制文件執(zhí)行类腮。
go run server.go