试图理解wasm，所以我在下面写了：操作 DOM调用JS函数定义一个可以被JS调用的函数前两个步骤很好，但最后一个没有按预期工作，因为我收到了 JavaScript 错误function undefined，我的代码在下面，我遇到的问题出在函数中subpackage mainimport ( "syscall/js")// func sub(a, b float64) float64func sub(this js.Value, inputs []js.Value) interface{} { return inputs[0].Float() - inputs[1].Float()}func main() { c := make(chan int) // channel to keep the wasm running, it is not a library as in rust/c/c++, so we need to keep the binary running js.Global().Set("sub", js.FuncOf(sub)) alert := js.Global().Get("alert") alert.Invoke("Hi") println("Hello wasm") num := js.Global().Call("add", 3, 4) println(num.Int()) document := js.Global().Get("document") h1 := document.Call("createElement", "h1") h1.Set("innerText", "This is H1") document.Get("body").Call("appendChild", h1) <-c // pause the execution so that the resources we create for JS keep available}将其编译为 wasm 为：GOOS=js GOARCH=wasm go build -o main.wasm wasm.go将文件复制wasm_exec.js到与以下相同的工作文件夹：cp "$(go env GOROOT)/misc/wasm/wasm_exec.js" .我的 HTML 文件是：<!DOCTYPE html><html><head> <title>WASM</title> <script src="http://localhost:8080/www/lib.js"></script> <!-- WASM --> <script src="http://localhost:8080/www/wasm_exec.js"></script> <script src="http://localhost:8080/www/loadWasm.js"></script></head><body></body><script> console.log(sub(5,3));</script></html>是lib.js：function add(a, b){ return a + b;}是loadWasm.js：async function init(){ const go = new Go(); const result = await WebAssembly.instantiateStreaming( fetch("http://localhost:8080/www/main.wasm"), go.importObject ); go.run(result.instance);}init();服务器代码是：package mainimport ( "fmt" "html/template" "net/http")我得到的输出是：
1 回答
互换的青春
TA贡献1797条经验 获得超6个赞
我找到了解决方案，我需要一些东西来检测并确认wasm已加载并准备好进行处理，这与 JS 中用于检查文档是否准备就绪的方法相同：
if (document.readyState === 'complete') {
// The page is fully loaded
}
// or
document.onreadystatechange = () => {
if (document.readyState === 'complete') {
// document ready
}
};
因此，作为wasm我的代码中的启动函数，我async在 JS 中使用了以下内容：
<!DOCTYPE html>
<html>
<head>
<title>WASM</title>
<!-- WASM -->
<script src="http://localhost:8080/www/wasm_exec.js"></script>
<script src="http://localhost:8080/www/loadWasm.js"></script>
</head>
<body>
</body>
<script>
(async () => {
try {
await init();
alert("Wasm had been loaded")
console.log(multiply(5, 3));
} catch (e) {
console.log(e);
}
})();
/***** OR ****/
(async () => {
await init();
alert("Wasm had been loaded")
console.log(multiply(5, 3));
})().catch(e => {
console.log(e);
});
/*************/
</script>
</html>
这帮助我确定文档已准备好处理并调用 wasm 函数。
wasm加载函数简单地变成了：
async function init(){
const go = new Go();
const result = await WebAssembly.instantiateStreaming(
fetch("http://localhost:8080/www/main.wasm"),
go.importObject
);
go.run(result.instance);
}
- 1 回答
- 0 关注
- 129 浏览
添加回答
举报
0/150
提交
取消