ハードウェアエンジニアの備忘録

電子工学(半導体物性)→応用光学・半導体プロセス→アナログ回路→C/C++→C#/.NETと低レイヤーから順調に(?)キャリアを登ってきているハードウェアエンジニアの備忘録。ブログ開始時点でiOSやサーバーサイドはほぼ素人です。IoTがマイブーム。

Socket.IOを使ってクライアントからRaspberry Pi 3のストリーム配信を開始する

ここに従う形で、クライアントPCからSocket.IO通信を使って、Raspberry Pi 3に通信しストリーミング配信を開始することを試みる。

 

Raspberry Pi 3 (サーバー)側の準備

まずは適当なディレクトリに移動し、git cloneする。済んだらcdで移動しておく。

$ git clone https://github.com/irisSchaffer/rpi-socket-streaming.git
$ cd rpi-socket-streaming

次に、Node.jsのパッケージ関係をそろえる。

$ npm install

また、Githubのリンク先には記述されていないが、忘れずにstreamディレクトリをrpi-socket-streamingの下に作成しておく。

$ mkdir stream

各自の環境に合わせて、IPアドレスやPort番号を変更する。まずは、config.json内の赤い部分を修正する。クライアントサイドのIPアドレスなので、WindowsPCで見るのであれば、cmd.exe→ipconfigを打ったときに表示されるアドレスが該当のアドレスだ。Macであればifconfigをターミナルで打ったときに表示されるアドレスを入れれば良い。

{
  "port": 9999,
  "client-host": "192.168.10.100",
  "client-port": 80,
  "capture-rate": 200,
  "capture-time": 100,
  "image-path": "stream",
  "image-name": "image.jpg",
  "image-width": 640,
  "image-height": 480
}

 

Windows PC (クライアント)側の準備

次にクライアント側の準備だが、Githubのリンク先に置いてあるclient.htmlをダウンロードし、54行目と56行目の赤字になっている部分を自分のRaspberry PiのIPアドレスに変更する。

<script src="http://192.168.0.102:9999/socket.io/socket.io.js"></script>
var socket = io.connect('http://192.168.0.102:9999');

これで、晴れて準備は終わり。

いざ、試す

まず、Raspberry Pi 3のターミナルからnodeコマンド。

$ node index.js
listening on *:9999

次に、Chromeなどでclient.htmlを開いて、Start Streamボタンを押す。

… 何も写らない

ChromeのConsoleを見ると、

f:id:tosh419:20160504183435p:plain

socket.ioが400 Bad Requestになっている。解決策はここに書いてあった。client.htmlを以下のように変更する。

// 古いやつ
// var socket = io.connect('http://192.168.10.102:9999');

// 新しいやつ
var socket = io.connect('http://192.168.10.102:9999',{transports:['websocket']});

polling→websocketにしてやるということでした。これで自分の場合はうまくいった。