こんにちは。主に個人でゲーム開発をしておりますToya Shiwasuと申します。この記事では、拙作のオンラインアクションRPGをWebGLビルドしてunityroomに投稿する際に行ったことをまとめています。なお、繰り返しを避けるためリンクで済むところはリンクで済ませています。

プログラミング

プラグインのコードのpointer_stringifyをUTF8ToStringに置換

今回のゲームのアップデートで、Unityのバージョンを2023.2.20f1に変更したのですが、ビルドに失敗するようになりました。利用していたプラグインのコードのpointer_stringifyをUTF8ToStringに置換することで解決しました。
https://github.com/naichilab/unityroom-tweet/issues/7

グラフィックス

Screen.orientationに値を代入しないよう書き換え

Screen.orientationに値を代入するとフリーズするので、以下のように書き換え、WebGLでは実行しないようにしました。

OrientationManager.cs

    void setOrientation(int orientation)
    {
        if (Application.platform == RuntimePlatform.WebGLPlayer)
            return;
        Screen.orientation = (ScreenOrientation)orientation;
    }

UI

多言語に対応したフォントを導入

フォントはFont.GetOSInstalledFontNames()でOSにインストールされているフォントを設定できるようにしていたのですが、WebGLでは0個のフォントしか取得できませんでした。go-noto-universalというフォントをまとめるソフトのサイトで配布されている「GoNotoKurrent-Regular.ttf」というフォントが、多言語に対応しているそうなので、導入しました。Google翻訳で翻訳できる108の言語で、各言語での言語名はすべて表示できるのを確認しました。ただ、「▲」などの全角記号が表示できないようです。
https://github.com/satbyy/go-noto-universal/releases/

IMEを使えるようにWebGLInputを導入

InputFieldでIMEが有効にならず日本語が入力できませんでした。WebGLInputというアセットを導入することで解決しました。
https://github.com/kou-yeung/WebGLInput/releases

GUIUtility.systemCopyBufferが機能しないので書き換え

GUIUtility.systemCopyBufferを使ったコピーが機能しませんでした。次の記事のコードを利用することで解決しました。
https://qiita.com/ttttpzm/items/1015b148c98a2d4da182

ファイル

セーブデータの保存後IndexedDBをフラッシュする処理を追加

セーブデータはApplication.persistentDataPathに保存していましたが、unityroomで確認したところ保存されていませんでした。IndexedDBをフラッシュする処理を追加して解決しました。自宅のブラウザでは特に問題なく動作しましたが、ネカフェのブラウザで動作確認したところ、Firefoxでのみ保存できませんでした。原因は不明です。
https://discussions.unity.com/t/webgl-flushing-data-to-indexdb/240698
また、IndexedDBはストレージの空き容量の10分の1程度までしか保存できないようなので、WebGLでは肥大化する恐れのあるログデータの保存は行わないようにしました。
https://iwatendo.hateblo.jp/entry/2018/02/15/215811

ネットワーク

ネットワークは、ロビーサーバーでC#のHttpListenerを、ゲームサーバーでMirrorというアセットを利用していたのですが、そのどちらもunityroomでは最初は動作しませんでした。unityroomはhttpsで接続するサイトなので、サーバーへの接続もhttpsで行うようにする必要があるようです。できるだけお金をかけずにMixedContent対応したかったので、「DDNS Now」という無料のダイナミックDNSサービスでドメインを取得し、そのドメインのSSL証明書を「Let's Encrypt」というサービスで無料で取得しました。
https://ddns.kuku.lu/index.php
https://letsencrypt.org/ja/
また、Nginxでhttpsからhttpにプロキシする設定を行うことで、クライアントプログラムの接続先はhttpsに書き換え、ロビーサーバーとゲームサーバーのプログラムはほぼそのままという最小限の変更で動作しました。HttpListenerでCROS設定を行い、MirrorはSimpleWebTransportを利用するよう修正しました。
https://qiita.com/kochiyukimoto/items/3c8f3a74f5f3727ddb71
https://mirror-networking.gitbook.io/docs/manual/transports/websockets-transport/reverse-proxy
https://github.com/MirrorNetworking/Mirror/issues/3012