最近、ebitenでのゲーム制作を始めました。PC・スマホ両対応にしたいので、まずはブラウザで動作できるようにして、スマホでの動作確認をします。
以下のサイトが参考になりますが、自分はWindows環境(シェルは git bashを使ったbash)なので、少し手こずりました。その情報を共有します。
WasmServe でとりあえず動かしてみる
上記サイトのOption 1.ですね。作ったゲームが main.go であるなら、
go run github.com/hajimehoshi/wasmserve@latest ./main.go
と入力し、http://localhost:8080/ にアクセスすればゲームをブラウザで動作させることができます。
ファイルが main.go だけではないのなら、
go run github.com/hajimehoshi/wasmserve@latest .
とかになりそうです。
ちなみに自分が遭遇したエラーなのですが、実行時にその環境の環境変数が長すぎるとエラーになります。
自分は暫定的に、めっちゃ長いけど使っていない環境変数を削除することで対応し、動くようになりました。
コンパイルして wasmファイルを作る
手順に書いてあるとおりに、以下のコマンドを実行します。
env GOOS=js GOARCH=wasm go build -o yourgame.wasm .
こんな感じのコマンドで wasm ファイルを生成します。github.com のパスの部分は自分のプログラムに変えてください。
yourgame.wasm が生成されます。
wasm_exec.js を持ってくる
yourgame.wasm はそのままでは動かず、コンパイルした環境に対応した wasm_exec.js が必要です。
それはGOROOT以下にあるので、
cp $(go env GOROOT)/misc/wasm/wasm_exec.js .
というコマンドで取ることができるのですが、自分のWindows環境ではハマりました。
$ go env GOROOT
C:\Program Files\Go
パスがこの形式で帰ってきてしまうし、空白を含んでいるので、そんなパスないよと言われてしまいます。
仕方ないのでベタ書きしましょう。
cp "C:/Program Files/Go/misc/wasm/wasm_exec.js" .
これで良いです。
HTMLファイルを作る
上記サイトの Creating an HTML に書いてあるとおりのHTMLファイルを作り、yourgame.wasm をwasm_exec.js と同じディレクトリに置きましょう。
MIMEタイプを変更する
それらをHTTPサーバーに置いて配信すれば良いのですが、自分の環境では以下のエラーが出ました。
192.168.0.4/:1 Uncaught (in promise) TypeError: Failed to execute 'compile' on 'WebAssembly': Incorrect response MIME type. Expected 'application/wasm'.
wasm ファイルは application/wasm のMIMEタイプであることが求められているのに、別のタイプになっているようです。
今回、自分の立てたHTTPサーバーはnginx を使っていたので、設定ファイルを追加して対応しました。
/etc/nginx/conf.d/mime.conf
types {
application/wasm wasm;
}
拡張子 wasm のファイルは application/wasm として配信するように設定します。
apacheなどの場合は、.htaccessに記載すれば良いと思います(やり方は違うので、調べてください)。
これでゲームが無事動作しました!