Rapiroをブラウザで動かしてみた 【カメラ表示編】

Rapiroの機能をひとまとめにしたインターフェイスを作成して、ブラウザから操作できるようにした。

「Rapiroをブラウザで動かしてみた 【準備編】」の記事はこちら

Rapiroをブラウザで動かしてみた 【準備編】
WebIOPiを使ってRapiroをブラウザから操作するためのWebサーバーを立てる方法を解説。

「Rapiroをブラウザで動かしてみた 【全体構成】」の記事はこちら

Rapiroをブラウザで動かしてみた 【全体構成】
Rapiroをブラウザから操作するための全体構成を解説したまとめ記事。ソースコード一式と各機能の実装解説記事リンクも掲載。

MJPG-streamerの起動

カメラの取り付け、MJPG-streamerの詳細についてはこちら

Rapiroにカメラをつけてみた
Rapiroはおでこにカメラを取り付けられるように設計されている。mjpg-streamerを使って、ブラウザから映像を見られるようにした。遠隔操作への一歩。

MJPG-streamerを起動。

今回はHTMLに埋め込むので、Webファイルの場所(-w)を指定。
ポート番号はWebIOPiと重複しないようにする。

cd /[homeディレクトリ]/mjpg-streamer/mjpg-streamer-experimental/
./mjpg_streamer -o "./output_http.so -w [HTMLがあるディレクトリ] -p [ポート番号]" -i "./input_raspicam.so -fps 30 -q 10 -vf -hf"

HTMLに組み込む

imgタグのsrcにカメラ映像のURLをフルパスで指定する。

  • ポート番号はMJPG-streamer起動時に設定したものを使う
  • IPアドレスとポート番号は環境に合わせて変更する
  • フルパスで書かないと映像が表示されないので注意
<img class="movie_area" src="http://[RapiroのIPアドレス]:[パラメータで指定したポート番号]/?action=stream">

例:丸パンダ研究所のRapiroの場合

<img class="movie_area" src="http://192.168.95.198:8080/?action=stream">

Rapiro起動時の設定

セットアップの記事でも書いているが、内容が若干違うので再掲。

カメラの映像を見たいときに都度手動でMJPG-streamerを起動してもいいが、毎回やるのはめんどくさいのでRapiroの起動時に自動でMJPG-streamerを起動するようにする。

方法はいくつかあるが、rc.localを使って自動起動するようにする。

rc.localを開く。
ここではvimを使用しているが、好きなエディタで構わない。

sudo vim /etc/rc.local

一番下に書かれている「exit 0」の上にMJPG-streamerを起動するコマンドを書き込む。

cd /[homeディレクトリ]/mjpg-streamer/mjpg-streamer-experimental/
./mjpg_streamer -o "./output_http.so -w [HTMLがあるディレクトリ] -p [ポート番号]" -i "./input_raspicam.so -fps 30 -q 10 -vf -hf" > /dev/null 2>&1 &

exit 0