Twitch Extensionsを使ったGenvidオーバーレイのテスト実行

# Genvid用クラウドサーバーを立てる前にTwitch配信をテスト
ゲームのライブ配信をインタラクティブなコンテンツにするツールキット「Genvid」は、配信システム一式がクラウドサーバー上で動作する設計になっています。
サービスのローンチ時にはクラウドサーバーでの動作が必須となりますが、開発中はなるべく費用を抑えながらテストしたいところです。
Genvidには、クラウドサーバーで動作させるミドルウェア一式を開発Windows上で動作させる「ローカルテスト」モードがあります。

サービス時の動作概念図は以下の通りです。

![[CEDEC2022]配信者 vs 視聴者多数！ライブ動画配信プラットフォームを活用した、非対称マルチプレイを実現するシステムの構築 (1).jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/19010/9d8d123b-5cab-e7eb-5fda-176bac8c2406.jpeg)

クラウドサーバー上でゲームのexeが実行され、動画配信サイトを介してブラウザへ動画が届きます。
開発段階として利用できる「ローカルテスト」モードの概念図は以下のとおりです。

![[CEDEC2022]配信者 vs 視聴者多数！ライブ動画配信プラットフォームを活用した、非対称マルチプレイを実現するシステムの構築 (2).jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/19010/41f60e35-ca7f-3daa-4dad-46b3eb619aa4.jpeg)
※図はCEDEC2022 [配信者 vs 視聴者多数！ライブ動画配信プラットフォームを活用した、非対称マルチプレイを実現するシステムの構築](https://www.docswell.com/s/ichijo/K3WQ1K-2022-09-20-150457)より。

動画をキャプチャするゲームexeが他のゲームインスタンスと接続する部分は変わらないのですが、その他のGenvidのサーバーミドルウェアやブラウザ上での描画はすべて開発用PC上で動作させることができます。

今回は、さらに動画配信の部分をTwitchを経由させて、本番環境に一歩近い状態に持っていってみます。
![Genvidシステム構成図.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/19010/0aaf4fea-a013-2101-7df9-e6d687cdb24e.jpeg)

Genvidシステムを開発PC上で動かすところは同じですが、動画の配信部分を実際にTwitchを使って流してみます。
ゲームの内部データをブラウザに配信して処理する「Genvid Stream」を使っている場合、実際の動画タイムコードとゲーム内部のデータタイムコードが一致して動作するかをテストできます。

# 実際の手順
「Standalone」と呼ばれるPC上で動画をレンダリングしてそのままブラウザに渡す（遅延をエミュレートすることもできる）モードは、高度に自動化されており、いくつかのPythonコマンドを呼ぶだけで実行できます。
Twitchを経由して動画配信のテストを行うためには、いくつか準備が必要です。

## Twitchの配信アカウント開設
まずは配信のためのアカウントを用意します。その上で、配信に必要なキーなどを確認します。

### Twitchチャンネル情報
クリエイターダッシュボードの「配信」から、「プライマリーストリームキー」に表示されているキーをコピーして設定します。

![配信 - Twitch - Google Chrome 2022-02-25 18.54.10.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/19010/e317ebec-3681-7aee-88b0-eedd5504ba69.png)

### rmtpサーバー情報
Recommended Ingest Endpointsから確認できます。おすすめは住んでいる地域によって異なるようです。
https://stream.twitch.tv/ingests/

## Genvidの設定ファイルにTwitch配信情報を設定
Genvidの設定はjsonまたはhclで定義して、コマンドラインで読み込ませる形式を取ります。
Twitch配信情報についてもこの方法で設定する他、Genvidの基盤システムBastionが立ち上がっている場合は、Cluster-UIでGUIから設定できます。

![Cluster-UI- local 2022-10-10 01-12-05.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/19010/93d50c00-bc24-ad0f-738c-7bffbd102417.png)

システムを再起動するたびに各種キーを手入力するのは面倒なため、hclファイルで記述してロードさせる手順をおすすめします。
Genvidに同梱されているcubeサンプルの場合は、config/steam.hclに設定する項目です。

```json
version = "1.7.0"

settings {
    encode {
    stream {
      enable  = true
      service = "twitch"
      addr    = "rtmp://<twitch-ingest-server>/app" //ここにrtmpサーバー情報
      channel = "channelname" //ここにチャンネル名
      key     = "live_NNNNNNNN_XXXXXXXXXXXXXXXXXXXXXXXXXXXXXX" //ここにプライマリーストリームキー
    } 
  }
    leaf {
    port = 30001
  }
} // end of settings

（略）
```

キー情報を配置した後、hclファイルをコマンドでロードします。
````
genvid-sdk load-config {ファイル名}.hcl
````

ロード後、各ジョブを起動することで動画がTwitchの指定のチャンネルで配信されます。

![twitch配信テスト.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/19010/1c7383e8-bb6d-06e2-a37a-34c083097060.png)

# Twitch Developer Rigの使用（現在不具合発生中）
本来であれば、ここからTwitchの開発ツール「Twitch Developer Rig」を使って視聴者用UIの動作確認を行うところですが、現在のDeveloper Rig（v1.2.15）はいくつか不具合があり、テストできません。
（ツール内で動画が表示されない、IPv6のローカルアドレスに接続できないなど）
なので、現状はいきなりクラウドサーバー側でのテストになります。Genvidシステムをクラウドサーバーで実行させるための手順については、次の記事にまとめています。

https://qiita.com/Takaaki_Ichijo/items/5d03ed0a2d764a2c1f3e