ソースコードから理解する技術－ＵｎｄｅｒＳｏｕｒｃｅＣｏｄｅ

手を動かす(プログラムを組む)ことで技術を理解するブログ

GolangでWebAssemblyの復習をした

golang

GolangでWebAssemblyの復習するため、いくつかサイトを見て写経してみました。
一年以上ぶり、かつ実行環境が異なったので、改めて気づいたことがあったので、メモとして残しておきます。

実行環境について

先に書いておくと、goenv、Visual Studio Code 固有のポイントに気づいた感じです。

気づいたポイント

ビルドコマンドはGOOS、GOARCHの指定も含めて一行で行う

https://github.com/golang/go/wiki/WebAssembly#getting-started
にあるように、以下のように一行のコマンドでビルドしないと、ブラウザからの実行時にエラーとなりました。
正しいwasm形式にビルドできないようです。

$ GOOS=js GOARCH=wasm go build -o main.wasm

wasm_exec.js、テンプレートのHTMLのコピー

サイトによってwasm_exec.jsのコピーのコマンドや、テンプレートのHTMLは自作するなどの違いがありましたが、
両方とも「GOROOT」環境変数を使ってコピーし、HTMLはファイル名を変更するのが効率がいいと思いました。

https://blog.gopheracademy.com/advent-2018/go-in-the-browser/
からの引用です。

$ cp "$(go env GOROOT)/misc/wasm/wasm_exec.js" .
$ cp "$(go env GOROOT)/misc/wasm/wasm_exec.html" .
$ mv wasm_exec.html index.html

goexecの実行について

ローカルでWebサーバを動かすのに「goexec」を使う例がありました。
https://github.com/shurcooL/goexec

「go get」で取得して「goexec」コマンドをそのまま実行しても、私の環境ではgoexecが見つからないでエラーとなりました。
goenvで複数のバージョンのgoを入れているためかと思われます。
以下のようにパスを含めたコマンドで実行できました。

$GOPATH/bin/goexec 'http.ListenAndServe(":8080", http.FileServer(http.Dir(".")))'

could not import syscall/js

syscall/jsのimportでVisual Studio Code上で「could not import syscall/js」というエラーとなりました。

https://github.com/Microsoft/vscode-go/issues/1874
こちらのissueにあるように、Visual Studio CodeのWorkspaceのsettings.jsonを以下のようにしたら解決しました。

{
    "go.toolsEnvVars": {
        "GOOS": "js",
        "GOARCH": "wasm",
        "GOROOT": "/usr/local/go",
        "GOPATH": "/home/corey/src/goprojects"
    }
}

以上です。