GitHub ActionsでUnityのWebGL Buildをしてレンタルサーバーに自動デプロイもしちゃう

VKet にロリポップレンタルサーバーが出展してた。大変びっくり。

VR界隈がwebでコンテンツを公開するケース、真っ先に思いつくのはやっぱり、asset のサンプル置き場にしたり、ポートフォリオにすることかな〜？ VKet にきてるということは VR Chat を使ってるわけだし、 Unity の出力を公開できればよいでしょう。

「とりあえず」で「無料だし」でよく使われる GitHub Pages では、営利目的は規約違反なのと転送量100 GBで帯域制限があるので用途・規模によってはキビシイ。この懸念点を解消するにはレンタルサーバーがぴったりなので、なるほどねという感じ。（なおロリポの場合月額220円~ のライトプランで転送制限なし、ストレージ200GBあるので十分っぽい）

Unity の Build ってのも結構時間かかるので、「Buildの完了を待ってサーバーに転送して公開」は人間もPCも拘束時間が長くなるため大変面倒。 GitHub Actions を使って「最初にポチっとして、あとは完了通知を待つだけ」にして楽しよう、更新のハードル下げようってのがこのpostの目的です。

作業順序
実行方法
- tag をつける
- 手動実行
利用した GitHub Action について

作業順序

ワークフローファイルを用意しときました。（大体のユースケースをカバーできるはず・・）これを設置して設定を書けば終わり！

GitHub Actions に登録

Unity Projectのサンプルを参考に、自身のUnity Projectのリポジトリの .github/workflows に以下2ファイルを追加します。

Unity WebGL Build の設定

secrets		example
`UNITY_LICENSE`	公式ドキュメントの手順に沿って取得した `Unity_v20XX.x.ulf` の内容	`<?xml version="1.0" ...`
`UNITY_EMAIL`	Unity アカウントのメールアドレス	`xxx@gmail.com`
`UNITY_PASSWORD`	Unity アカウントのパスワード	`password`

FTPS の設定

FTPS を用いてサーバーにデプロイする場合は、以下の variables, setrets を登録します。

variables		example
`DEPLOY_PROTOCOL`	tagをpushした際のデプロイ方法を指定します	`ftps`

secrets		example
`FTPS_HOST`	ホスト名	`hostname`
`FTPS_USER`	ユーザー名	`user`
`FTPS_PASSWORD`	FTPのパスワード	`password`
`FTPS_PORT`	ポート	`21`
`FTPS_DEST_PATH`	サーバーのアップロード先のディレクトリパス。（末尾 `/` の必要があるので注意）	`~/html/webgl/`

SFTP の設定

SFTP を用いてサーバーにデプロイする場合は、以下の variables, setrets を登録します。

variables		example
`DEPLOY_PROTOCOL`	tagをpushした際のデプロイ方法を指定します	`sftp`

secrets		example
`SFTP_HOST`	ホスト名	`hostname`
`SFTP_USER`	ユーザー名	`user`
`SFTP_KEY`	サーバーにSSHログインできる秘密鍵	`-----BEGIN RSA PRIVATE KEY-----...`
`SFTP_PORT`	ポート	`22`
`SFTP_DEST_PATH`	サーバーのアップロード先のディレクトリパス。（実態はrsyncで転送されるので対象ディレクトリ内を丸ごと置き換える。ホームディレクトリは避けた方が無難だろう。ここら辺の挙動を変えるには https://github.com/marketplace/actions/ftp-deploy を参照して改変しましょう）	`~/html/webgl/`

注意秘密鍵は issueで問題を指摘されているのだが、現状は以下のコマンドのようにPEM形式で生成したモノでないと接続できない（2023年7月現在）

ssh-keygen -m PEM -t rsa -P "" -f afile

webサーバーの設定

利用するwebサーバーによっては、そのままでは WebGL アプリが実行できないことがある。公式ドキュメントを参考に設定ファイルを追加してあげよう。

ロリポップレンタルサーバーでは、以下の記述の .htaccess ファイルを配置すればOK

<IfModule mod_mime.c>

# The following lines are required for builds without decompression fallback, compressed with gzip
RemoveType .gz
AddEncoding gzip .gz
AddType application/octet-stream .data.gz
AddType application/wasm .wasm.gz
AddType application/javascript .js.gz
AddType application/octet-stream .symbols.json.gz

# The following lines are required for builds without decompression fallback, compressed with Brotli
RemoveType .br
RemoveLanguage .br
AddEncoding br .br
AddType application/octet-stream .data.br
AddType application/wasm .wasm.br
AddType application/javascript .js.br
AddType application/octet-stream .symbols.json.br

# The following line improves loading performance for uncompressed builds
AddType application/wasm .wasm

実行方法

サンプルの https://github.com/kumak1/webgl-build-exam/blob/main/.github/workflows/deploy.yml では以下２つの方法がとれます。

tag をつける

セマンティックバージョニング（ v1.0.0 など）の tag をつけて push する。

手動実行

Actions > Deploy > Run workflow で実行する。

利用した GitHub Action について

Unity の Build
- https://github.com/game-ci/documentation
FTPS（ロリポップなど）の場合の転送
- https://github.com/marketplace/actions/ftp-deploy
SFTP（ロリポップマネージクラウドなど）の場合の転送
- https://github.com/marketplace/actions/web-deploy-anything

GitHub Actions を用意するのは面倒かもしれませんが、はじめだけ設定してしまえば、

Unity を起動する必要がない
Actions の実行が始まったら放置でOK
Actions の完了通知がメール等で届く（設定しだい）
サーバーの接続情報とか引っ張り出す必要ない

などなどメリットたくさん。継続開発するものはとりあえず登録して、楽しちゃいましょう。

kumak1’s blog

kumak1のイラストや技術ログ