コンテンツへスキップ
Tags

GoではじめるWebAssebmly その1「Hello World」

by : 2018/12/14

WebAssebmlyはWebブラウザ上でバイナリファイル（テキスト形式もあり）を実行できる環境です。JavaScriptと異なりコードの漏洩がなく、実行速度も高速というのがメリットです。

WebAssebmlyは元々Rustで開発することが多かったですが、最近では様々なプログラミング言語が対応しています。その一つがGoです。Go 1.11からWebAssembly向けにもコンパイルできるようになっています。

この記事ではWebAssembly · golang/go Wikiに沿ってGoでWebAssemblyを実行するまでを紹介します。

環境

WebAssebmlyはモダンなWebブラウザが対応していますが、Goが提供するJavaScriptコードがSafariでは動きませんでした。以下はGoogle Chromeで試しています。

Goのコード

今回はとてもシンプルなコードです。 main.go として作成します。


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

view raw

index.go

hosted with ❤ by GitHub

このコードをGoでコンパイルします。


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

view raw

index.

hosted with ❤ by GitHub

これで main.wasm というファイルが作成されます。

HTMLについて

HTMLはテンプレートになっており、以下を使います。


<html>
<head>
<meta charset="utf-8">
<script src="wasm_exec.js"></script>
<script>
const go = new Go();
WebAssembly.instaantiateStreaming(fetch("main.wasm"), go.importObject).then((result) => {
go.run(result.instance);
});
</script>
</head>
<body></body>
</html>

view raw

index.html

hosted with ❤ by GitHub

JavaScriptについて

WebAssebmlyを解釈するのにGoが提供しているJavaScriptライブラリを使います。


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

view raw

index.

hosted with ❤ by GitHub

この3つのファイルで実行します。

goexecのインストール

HTTPサーバを立てる必要があるので、goexecをインストールします。


$ go get -u github.com/shurcooL/goexec

view raw

index.

hosted with ❤ by GitHub

これで準備完了です。

実行する

HTTPサーバを立てます。


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

view raw

index.

hosted with ❤ by GitHub

http://localhost:8080/ でHTTPサーバが立ち上がるので、Google Chromeからアクセスします。

開発者ツールのコンソールに Hello, WebAssembly! と出力されれば完成です。

GoでWebAssemblyを書く場合、特別なテクニックが必要という訳ではありません。普段のGoの書き方で、コンパイル方法を指定するだけです。Goであれば、よりモダンな書き方でWebAssemblyが使えるようになりますのでお勧めです。

From → HTML5

コメントは受け付けていません。

«
»
%d人のブロガーが「いいね」をつけました。