本記事は2021年08月13日に弊社技術ブログで書かれたものの移植記事です。古い情報が書かれている可能性があります。
Unityで作った自作アプリの中で、ボイスチャットをしたい！と思うのは、全世界の人々が望む夢ではないでしょうか（過言）。ボイスチャット機能を実装するためのアセットを提供しているサービスは、Photon Voice2、Vivoxなど、有名どころからニッチな層まで様々なサービスが存在しています。
その中でも本記事では、純国産の通信エンジン「Monobit Unity Networking (MUN)」を使ってボイスチャットのデモを実装するための手順と小ネタ・ポイントを紹介していきます。
本編
そもそも、今までUnityなどのゲームエンジンで「オンラインゲーム」を開発しようものなら、サーバ構築などのインフラ知識や、ネットワーク通信の深い理解がないと作れないものでした。その上、個人でオンラインゲームを開発しようともなれば、サーバを立てるだけでも数年かかってしまうことがザラにありました。しかしながら、2017年ごろから”Monobit Revolution Server”、その後”モノビットエンジンクラウド“が登場し、オンラインで遊べるアプリの敷居はぐんと下がりました。
そこで、我々も先人方の知恵とモノビットエンジン公式のドキュメントを見ながら、モノビットエンジンクラウドを使ってボイスチャットのデモアプリを作成してみよう、というのが本記事のメインテーマです。早速実行環境を確認してから、アプリの作成に入りましょう！
実際に作ってみる
本編の本編、始まります！公式サンプルに則って進めますので、そちらの確認もお願いします！
モノビットエンジン側でやること
- モノビットクラウドエンジンでアプリの「アプリケーションID」と「MUNリゾルバー一覧取得エンドポイント」を取得する
- MUNから「MUNクライアントアセット」・「VR Voice Chat with MUN」をダウンロードする
たったこれだけです！以下で、スクリーンショットと共に手順を詳しく説明していきます！
モノビットクラウドエンジンにログイン（新規登録）
新規登録フォームに、メールアドレスを入力して、規約を読んでから「登録する」を押下します。
以下のようにメールが届くので、下のリンクからパスワードの設定をします。
自分のホーム画面の確認
設定したメールアドレスとパスワードでサインインしたら、自分のホーム画面に辿り着きます。この「サンプルアプリ」は、モノビットクラウドが最初から用意してくれているものですが、もうさっそく実践で使いた～～い！という方は、画面上部の「アプリの新規登録」→「登録する」と押下していくと、自分の作りたいアプリも作成できます。
「サンプルアプリ」のアプリケーションIDとMUNリゾルバー一覧取得エンドポイントが後で必要になりますので、タブはこのまま開いておいてくださいね。
また、CCU数（接続できる回線数）が足りない！という方や、通信枠が30GBは少ない！という方は、公式ページの料金プランを見つつ懐事情と相談しながら決めてくださいね。料金プランの変更は、上画像中央にある「変更」ボタンからいつでも出来るようになっています。（やったことがないのであまり詳しく説明できませんが…）
Unityアセットをダウンロード
Monobit Unity Networking 2.0 (MUN)公式ページのダウンロード欄から、「MUNクライアントアセットダウンロード」ボタンを押下するだけ！利用規約も目を通してくださいね。
続けて、VR Voice Chat with MUN公式ページのダウンロード欄から、「VR Voice Chat with MUN」のところを押下します！これで、モノビット側でやることは終わりです。
Unity側でやること
プロジェクトの作成
Unity Hubからプロジェクトの新規作成を行います。Unityのインストールからプロジェクトの作成まで、過去の記事でも詳しく書いているので、宜しければご確認ください。
テンプレートの中から３Dを選択し、任意のプロジェクト名を入力して、保存先を設定します。
このとき、保存先のパスが長くなり過ぎないように注意してください！
パス長が256を超えると、フォルダにアクセスできなくなるため、エラーの原因になります！
プロジェクトにアセットを追加
上記手順のUnityアセットをダウンロードでダウンロードした2つのファイルを、Unity画面にドラッグ＆ドロップ、またはダブルクリックします。Importの確認画面が表示されますので、全てのフォルダにチェックが入っていることを確認して、Importします。
サーバー設定の変更
Windowsタブの【Monobit Unity Networking】→【Pick Up Setting】を選択します。Server Settingの中の、”Protocol”をTCPに変更しましょう。上記手順の自分のホーム画面の確認のところで取得した、アプリケーションIDを”AppID”、MUNリゾルバー一覧取得エンドポイントを”Endpoint Address”にコピー＆ペーストしましょう。
プレハブを保存するためのフォルダの作成
まず、Assets枠内で右クリック→【Create】→【Folder】で新しいフォルダを作成します。フォルダの名前は「Resources」にします。公式サンプルにも、このように記述があるので、スペルミスやタイポにご注意を！
「Resources」という名前に一字として誤りが許されません。スペルミスにはご注意ください。
ボイスチャット用オブジェクトを作成する
ボイスデータの送受信、マイク入力＆スピーカー出力を処理するオブジェクトを作成します。このオブジェクトは、プレハブ化出来るものであれば何でも良い（公式より）ですが、本記事でもSphere（球）を使いましょう！
Hierarchyタブの中で右クリック→【3D Object】→【Sphere】を選択して、球オブジェクトを作成します。
オブジェクトにコンポーネントを追加する
Sceneタブに球体が出てきました！そのままSphereを選択して、Inspectorタブにある「Add Component」を押下してください。
プルダウンメニューから【Monovit View】と【Monovit Voice】を選択します。コンポーネントが5つ程追加されます。各種コンポーネントの詳細は公式ドキュメントの参照をお願いします！
オブジェクトをプレハブにする
ボイスチャット用オブジェクトをResourcesフォルダ内に【プレハブデータ】として保存しましょう。…といっても、さっきまで触っていたSphereをResourcesフォルダにドラッグ＆ドロップするだけです！
プレハブを作成し終えたら、生成元オブジェクトは不要なので、削除します。Hierarchyタブに存在する「Sphere」を右クリックし、ポップアップから【Delete】を選び、削除してください！
ボイスチャット制御用の空オブジェクトを作成する
先に作成したボイスチャット用オブジェクトを使い、【サーバ接続】→【ルーム入室】→【ボイスチャット開始】のための空オブジェクトを作成します。
Hierarchyタブの中で、右クリック→【Create Empty】を選択して、スクリプト登録用の空オブジェクトを作成します。
コンポーネントの追加
以下のように、GameObjectが作成されます。続けて、Inspectorタブにある【Add Component】のボタンを押下します。プルダウンから、【Monovit View】を選択しましょう。
もう一度Inspectorタブにある【Add Component】のボタンを押します。プルダウンメニューから【New Script】を選びます。Name欄に「VoiceChatScript」と入力し、【Create and Add】ボタンを押します。
Inspectorタブに【VoiceChatScript（Script）】が追加されました！スクリプトの修正する前に、Monovit Viewコンポーネントの”Monovit View ID”を0から1に変更してEnterで適用させましょう。（静的オブジェクトの場合1～999の範囲で指定する必要があるため）
追加した【VoiceChatScript（Script）】を開いて編集しましょう。グレーアウトされた赤枠部分をダブルクリックしてください。
追加したスクリプトの編集
VisualStudioが起動し、VoiceChatScriptが開きます。
以下にコードを貼っておきますので、モノビット公式ページの説明を見るのがちょっと面倒…という方は、以下のコードを自分の【VoiceChatScript.cs】にコピー＆ペーストしてください！コメントも丁寧に書かれているので、コードリーディングだけでも意味が掴めそうですね。
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using MonobitEngine;
public class VoiceChatScript : MonobitEngine.MonoBehaviour
{
// プレハブ化した「ボイスチャット用オブジェクト」のデータ
private GameObject chatObj = null;
// Start is called before the first frame update
void Start()
{
// MUNサーバに接続する
MonobitNetwork.autoJoinLobby = true;
MonobitNetwork.ConnectServer("VoiceChatTest_v1.0");
}
// Update is called once per frame
void Update()
{
// ルーム入室済みでボイスチャット用オブジェクトが未生成であれば、オブジェクトの動的生成を実行する
if (MonobitNetwork.inRoom && chatObj == null)
{
chatObj = MonobitNetwork.Instantiate("Sphere", Vector3.zero, Quaternion.identity, 0);
return;
}
}
// ロビーに入室した直後のコールバックメソッド
public void OnJoinedLobby()
{
// もし「VoiceChatTest」と同名のルームが未作成なら、そのルーム作成して入室する
// もし「VoiceChatTest」と同名のルームが作成済みなら、そのルームに入室する
MonobitNetwork.JoinOrCreateRoom("VoiceChatTest", new RoomSettings(), null);
}
}
ビルドの準備
FileタブのBuildSettings…から今作ったアプリのビルドをしましょう！最初に、BuildSettingsの【Add Open Scenes】から、今編集していたシーンをビルドするように設定しましょう。
続けて、Build Settings画面左下にある【Player Settings…】ボタンを押下すると、Project Settings画面が表示されますので、【Player】タブに移動します。Resolution and Presentationの中の【Visible in Background】にチェックが入っていることを確認します。もし外れているようなら、チェックを入れます。
アプリをビルドしてみよう！
準備も無事終わったはずなので、アプリをビルドしましょう！Project Settings画面を右上の×で消して、Build Settings画面に戻ります。Build Settings画面の右下のBuildを押して、アプリの保存先を設定します。（今回は新しいファイル【App】を作成しています）
保存先ファイルを覗くと、アプリケーションファイルが作成されています！早速テストしてみましょう！
実行してみよう
下スクリーンショットのように、画面上に球体が表示されるようになったら、マイクを使って発言してみてください。（PCから音声デバイスの許可を求められたら許可を選択してください）
複数PCがある場合は、アプリケーションファイルを複数PCで実行し接続すれば、自分の声が別PCのスピーカーやヘッドフォンから再生されます。
PCが１つしかない！という方は、作成したアプリを開く＋Unityプロジェクトの実行ボタン「▶」を押すことで一人でもボイスチャットのテストが出来ます。恥ずかしがらずPCに話しかけてみましょう。スピーカーから自分の声が聞こえるはずです。（多少のタイムラグはあります！）
↑自分の声が反響してちょっと怖かった図
感想
そう時間はかからずにアプリのビルドまで行けたのではないでしょうか。私はモノビットエンジンクラウドの設定に難儀して、ハチャメチャに時間が掛かりました。（ちゃんとドキュメントを読めてなかっただけなのですが…）私が特に驚いたこととして、かなり音質良くないですか！？正直、無料枠で体験させてもらってるんだし、ガビガビの音声が聞こえるものだとばかり思っていました…。モノビットエンジンさん流石です！一生付いていきます！