( ꒪⌓꒪) ゆるよろ日記

( ゚∀゚)o彡°オパーイ!オパーイ! ( ;゚皿゚)ノシΣ フィンギィィーーッ!!!

ラズパイとWebRTCで動物の死活監視ができるようにした話

こんにちわ、しいたけです。

今は夏休みで奥さんと子どもたちが帰省しているので、動物と2人で暮らしています。

で、外出すると動物だけを家に残していくことになります。 ペットモニターとか市販でもあるんですが、せっかくなので、 夏休みの自由研究として、ラズパイ+カメラモジュールとWebRTCを使って、外出先からでも動物の状態を確認できるやつを作ってみました。

f:id:yuroyoro:20190812154310j:plain

↑ 死活監視される動物の様子です

用意したもの

ラズパイ3とケースのセットとカメラモジュールは Raspberry Pi Shop by KSY で購入。期間限定セールでちょっと安かったです。 このセットについてるケースは、ラズパイのマークの穴にカメラモジュールを固定することができて便利。 時雨堂のmomoだと、Raspberry PiGPUH.264 ハードウェアエンコーダー機能を利用できるらしいので、ラズパイzeroでも行けるらしいです。

で、ラズパイを三脚とスマホ用アダプタで固定します。こんな感じになる。

f:id:yuroyoro:20190814165439j:plain

ラズパイの初期設定

まずはラズパイの初期設定でOSインストール。購入したキットのSDカードにすでにOSが用意されているので、電源入れて画面の通りにセットアップすれば終了。

Raspberry Pi 3 Model B+の初回セットアップ(購入から起動まで) - Qiita

あとは、sshとカメラモジュールをconfigから有効にしておく。

Raspberry Piカメラのセットアップ方法

最後に、mDNSとssh周りの設定を行って、GUIをオフにして完了。これで手元のmacbookからsshで接続して作業できるようになった。

手持ちのRaspberryPiをサクッとmDNSに対応させる - Qiita

WebRTC Native Client Momo

時雨堂の WebRTC Native Client Momo を使います。あっさり接続できて最高でした。

Githubのリリースページ から最新のバイナリがtarで配布されているので、ダウンロードして解凍するだけです。

必要なライブラリを入れて、

$ sudo apt-get install libnspr4 libnss3

あとはバイナリを実行するだけで、ラズパイのカメラモジュールを利用したストリーミングが可能になります。

$ ./momo --no-audio ayame wss://ayame-lite.shiguredo.jp/signaling <your-github-id>@<your-room-name> --signaling-key <your-signaling-key>

起動時のオプションは、シグナリングサーバーにAyameとそのURL、そしてルームIDを指定します。また、次で説明するシグナリングキーもわたします。

時雨堂 WebRTC シグナリングサービス Ayame Lite

WebRTCにおいてNAT超えで通信を行うにあたって、シグナリングサーバを介してそれぞれのピアの接続の調整を行う必要がある。 時雨堂がWebRTC の P2P 利用向けに無料で利用できるシグナリングサービスを提供してくれているので、ありがたく使わせていただきます。

WebRTC シグナリングサービス Ayame Lite 開発ログ

P2Pで接続できる場合には、特に登録も必要なく使えます。4G回線の場合などTURNサーバーを経由する必要がある場合は、ベータテスト中のシグナリングキーを利用してTURNサーバーの払い出しをしてもらう必要があります。 Githubアカウントでサインアップすると、シグナリングキーが発行されてTURN サーバの利用が可能になります。

STUN/TURNについてはこのあたり参照

4Gでつながらないとtwitterで囀っていたところ、 @voluntas にベータ版使ってみる? とお誘いを受けたので、ありがたく使わせてもらいました。 ちょうどオープンベータが始まったところでした。

Ayame Lite オープンベータテスト開始しました - shiguredo - Medium

こちらからGithubアカウントでサインアップできます。

Ayame Lite

時雨堂最高では?

クライアント側の実装

あとは、クライアントを準備して接続です。手っ取り早く試してみるのに、 OpenAyame/ayame-react-sample: Ayame React サンプル を利用しました。 上記のリポジトリgit clone したあと、 yarn install して yarn serve すると、localhostで動作確認ができます。

こんな感じで、AyameのURLと、自分で指定したルームID、シグナリングキーを入力して接続を押すと、ストリーミングでラズパイ側のカメラから配信されていることが確認できます。

f:id:yuroyoro:20190814182922p:plain

iOS Safariの場合は再生ボタンを押す必要があるとのことで、video タグに controls を追加して対応しました。

<Videos>
  <RemoteVideo ref={remoteVideoRef} muted autoPlay controls/>
</Videos>

その他調整

まず、クライアントのアセット一式を適当な場所から配信できるようにします。 yarn build してできた成果物をさくらVPSにnginxを立ててレッツをエンクリプトしてhttpsで配信できるようにしました。 httpsで配信できる場所なら、cloudfrontとかNetlifyとかでもいいと思います。

あとは、ラズパイ側のmomoをsystemdのサービスとして設定して起動時に起きるようにすれば終わりです。

Raspberry Pi で systemd を使ってプログラムを自動実行する - Qiita

まとめ

ラズパイでWebRTCするにあたって、当初は NTTコムさんの提供する Skyway とそのsdkを試してみたのですが、どうもデモが上手く動作しませんでした。 時雨堂のmomoとOpenAyameを使ってみたところ、バイナリを落としてきてドキュメントの手順通りに進めるだけであっさり接続できてしまいました。

これで外出時でも動物の様子を死活監視ができて捗る。

時雨堂最高では?