提供している在宅医療サービスに、利用者と担当医師との間で使えるビデオチャットを実装したいなぁと、以前から考えていました。

そんなかんなで、WebRTCを勉強しようと彷徨っていたら、下記のサイトと遭遇!!

WebRTCを使ってみよう!

※サイトの表示は、2014年のなんですが、2016年に再掲載されています。

具体的なソースは掲載されているうえ、一歩ずつ実装を確認できるので、今回この記事を参考に勉強してみることとしました。

Webサーバーを実装することに。。

最初のメッセージを手動でコピペするのは、すぐに動作しました。

第2回めのメッセージの自動交換が今回のつまずき・・・ではなく、勉強のお時間が来ました(^^;

シグナリングサーバーをローカルでやるには、掲載通りのソースで動いてくれました。

コネクトボタンを押した途端にメッセージ交換されて画像が出てきたのは感動です(^^)

で、シグナリングサーバーをVPSで作っているテストサーバーでやろうとなったときに、今回のジタバタがスタートしました。

まずは、ソースそのままで、動かしたところ、ソケットの初期化時にエラーが表示されました。

今回の記事では画像交換をしているので、カメラを使います。

そのためには、SSLを利用しています。

ところが、記事のクライアントソースでは”ws://〜:ポート番号”となっているためにSSLのなかにnon SSLのコンテンツがあるとなってしまったんです。

これを解消するためには、”wss://サーバー” として、やる必要があります。

また、サーバー側がnode.jsなので、reverse proxy構成とする必要があります。

ついでに、SSLの符号化はWebサーバーに任せたい。。

そんなわけで、呼び出すときにポート指定をする必要がなくなります。

これらを考慮して、Webサーバーとしてnginxを利用して、reverse proxyを構成することとしました。

プロキシー設定のヘッダー情報が。。

今回は、ヘッダー情報をプログラムにわたすところで、引っかかりました。

nginxのドキュメントの「WebSocket proxying」のところに、必要な内容が書かれています。

location /chat/ {
 proxy_pass http://backend;
 proxy_http_version 1.1;
 proxy_set_header Upgrade $http_upgrade;
 proxy_set_header Connection "upgrade";
}

これを設定していなかったので、ソケットの初期化のところで、ず〜っとエラーが出てくれていました(^^;

これがわかるまで、結構ウロウロしました。

わかってしまえばなんですがね(^^;

さて、お次は、呼び出しにチャレンジです(^^)v