Golang编译wasm

使用Go

创建main.go文件

  • main.go
1
2
3
4
5
6
7
package main

import ("fmt")

func main() {
fmt.Println("Hello, Go WebAssembly!")
}

编译go文件,得到lib.wasm文件

1
2
3
4
5
6
set GOOS=js
echo %GOOS%
set GOARCH=wasm
echo %GOARCH%
go build -o lib.wasm main.go
pause

获取wasm_exec.js

https://github.com/golang/go/blob/master/misc/wasm/wasm_exec.js

新建一个index.html文件

  • 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
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
<!doctype html>
<!--
Copyright 2018 The Go Authors. All rights reserved.
Use of this source code is governed by a BSD-style
license that can be found in the LICENSE file.
-->
<html>

<head>
<meta charset="utf-8">
<title>Go wasm</title>
</head>

<body>
<!--
Add the following polyfill for Microsoft Edge 17/18 support:
<script src="https://cdn.jsdelivr.net/npm/text-encoding@0.7.0/lib/encoding.min.js"></script>
(see https://caniuse.com/#feat=textencoder)
-->
<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();
console.log(go.importObject);
console.log(WebAssembly);
go.importObject.env = go.importObject.env || {};
go.importObject.env['command-line-arguments.add'] = function(x, y) {
return x + y
};

let mod, inst;
WebAssembly.instantiateStreaming(fetch("lib.wasm"), go.importObject).then((result) =- {
mod = result.module;
inst = result.instance;
document.getElementById("runButton").disabled = false;
}).catch((err) =- {
console.error(err);
});

async function run() {
console.clear();
await go.run(inst);
inst = await WebAssembly.instantiate(mod, go.importObject); // reset instance
}

</script>

<button onClick="run();" id="runButton" disabled>Run</button>
</body>

</html>

需要go服务器支持wasm的meta类型

  • server.go
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
package main

import (
"flag"
"log"
"net/http"
)

var (
listen = flag.String("listen", ":8080", "listen address")
dir = flag.String("dir", ".", "directory to serve")
)

func main() {
flag.Parse()
log.Printf("listening on %q...", *listen)
err := http.ListenAndServe(*listen, http.FileServer(http.Dir(*dir)))
log.Fatalln(err)
}

启动服务器

1
go run server.go

使用Tinygo

创建main.go文件

  • main.go
1
2
3
4
5
6
7
8
9
10
11
12
package main

func main() {
println("Hello, tinygo wsam!!!")
println("adding two numbers:", add(2, 3)) // expecting 5
}

func add(x, y int) int

func multiply(x, y int) int {
return x * y;
}

编译go文件,得到lib.wasm文件

1
2
tinygo build -o lib.wasm -target wasm ./main.go
pause

获取wasm_exec.js

https://github.com/tinygo-org/tinygo/blob/release/targets/wasm_exec.js

新建一个index.html文件

  • 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
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
<!doctype html>
<!--
Copyright 2018 The Go Authors. All rights reserved.
Use of this source code is governed by a BSD-style
license that can be found in the LICENSE file.
-->
<html>

<head>
<meta charset="utf-8">
<title>Go wasm</title>
</head>

<body>
<!--
Add the following polyfill for Microsoft Edge 17/18 support:
<script src="https://cdn.jsdelivr.net/npm/text-encoding@0.7.0/lib/encoding.min.js"></script>
(see https://caniuse.com/#feat=textencoder)
-->
<script src="wasm_exec.js"></script>
<script>
const go = new Go();
const WASM_URL = 'lib.wasm';
go.importObject.env = go.importObject.env || {};
go.importObject.env['command-line-arguments.add'] = function(x, y) {
return x + y
};
console.log(go.importObject);
var wasm;
if ('instantiateStreaming' in WebAssembly) {
WebAssembly.instantiateStreaming(fetch(WASM_URL), go.importObject).then(function (obj) {
wasm = obj.instance;
go.run(wasm);
console.log('multiplied two numbers:', wasm.exports.multiply(5, 3));
})
} else {
fetch(WASM_URL).then(resp =>
resp.arrayBuffer()
).then(bytes =>
WebAssembly.instantiate(bytes, go.importObject).then(function (obj) {
wasm = obj.instance;
go.run(wasm);
console.log('multiplied two numbers:', wasm.exports.multiply(5, 3));
})
)
}

</script>
</body>

</html>

需要go服务器支持wasm的meta类型

  • server.go
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
package main

import (
"flag"
"log"
"net/http"
)

var (
listen = flag.String("listen", ":8080", "listen address")
dir = flag.String("dir", ".", "directory to serve")
)

func main() {
flag.Parse()
log.Printf("listening on %q...", *listen)
err := http.ListenAndServe(*listen, http.FileServer(http.Dir(*dir)))
log.Fatalln(err)
}

启动服务器

1
go run server.go

本博客所有文章除特别声明外,均采用 CC BY-SA 4.0 协议 ,转载请注明出处!