console.lealog();

@leader22のWeb系に関する勉強めもブログですのだ

WebRTC Meetup Tokyo #14 に行ってきたメモ #webrtcjp

そういやもう3月も終わりやけど、これが2017年初の行ってきたメモなのね・・。

ちなみにですが、4月にあるWebRTCのハンズオンでメンターとかやります。

初心者向け! WebRTCハンズオン - connpass

WebRTCを用いたビデオチャット接客 ~オンラインとリアル店舗/AIと人間コミュニケーションの融合とは

No配信なのでNoメモです。

ディベートでのWebRTC利用

こっちもNo配信なのでNoメモです!

Creating appear.in premium

Appear.in premium walkthrough

appear.in の中の人、@daginge よりプレミアムコースを作ったことについて。

プレミアム化

  • 利用者からも有料化を希望する声はあったし、それに応えたかった
    • もっとたくさんの人を部屋に入れるようにしたり
    • 細かな挙動をカスタマイズできたり
  • そこでまず問題を整理した
    • 1部屋に入れる人数
    • 通信品質
    • カンファレンスみたいな 一対多配信とかの機能
    • スクリーン共有とかも

何が問題だったか

  • 1部屋に入れる人の数を
    • 8人では足りない
    • でも何人なら十分なのか
  • 通話の品質
    • 多少なら気にならないし、それを補正する人間の脳はすごい
    • しかし高品質 is ..?
    • レイテンシーよりも快適に通話できる「体験」を品質として定める

どうやって解決するか

  • P2Pはフルメッシュなので帯域がヤバい
  • そもそもインターネットという不確定な基盤の上でどうやるか
  • パケロス、ジッターとの戦い
  • https://github.com/opentok/rtcstats で計測する
  • `b=AS` SDPで帯域を部屋の人数にあわせて調整した
    • ただし256k/sを下回ると見れたもんじゃなかった
    • この高解像度時代のスクリーンも共有もなおさら
  • 試しにSFUにしたらそっちのほうが圧倒的に体験がよかった

appear.inのSFU

  • JavaScript x Cのバインディングを少々のフルスクラッチ
    • SFUのコアとかも(暗号化とかはライブラリ使ってるけど
    • 初期verは3000行くらい
  • ホストが違うならフルメッシュで
  • AWSのリージョンごとに複数のサーバーを建ててる
  • 自作すると色々知れて良い
    • 自分の道具は自分で作る精神
    • 自作のルールで色々設定したりスケールできたりするので
  • 自作するのは大変
    • 問題が山積み(その問題を解決するために別の問題が・・以下ループ
    • 初期verから最初のリリースまで10ヶ月かかった
  • それぞれのSFUシグナリングもやる
  • 近いとこにあるDNSから探してくる(レイテンシー重視)
  • リージョンが違ってもSFUどうしはAWSの中でやり取りする
    • グローバルなインターネットではなく、AWS内の別回線なので快適

プレミアム

MS EdgeのWebRTC対応について

Microsoft EdgeのWebRTC対応について調査した - Qiita

  • EdgeがWebRTCに対応!
    • appear.inも動いてた

build 15019より

  • `getUserMedia()`はhttpでもできる
  • DataChannelは未対応
  • MediaRecorderも未対応
    • H.264で検討はしている・・
  • 映像/音声コーデックまわりもChrome/Firefoxと通信できるように

動かしてみた

  • 最新は15063なのでちょい違うかも
  • STUN
  • TURNないと動かない
  • TrickleICEもできるっぽい
  • Multistreamも(SDPには出ない)
  • adapter.jsはそのままで
  • SkyWayの公式対応は未定
  • peer.jsはダメそう

WebRTCで元オリンピック陸上選手の為末大のリハビリを遠隔でやってみた

ビデオ通話の機能にWebRTC

  • tokbox/opentok
    • 顧客との通話内容が暗号化できる
    • 通話を保存できる(何かあったときに必要なので)
  • 実際に体を動かしてもらって、その様子から腰痛主訴を特定できる
  • 2020パラリンピックに向けて、腰痛以外のリハビリにも活用していきたい

ブラウザでiOSゲートウェイ作ってみた

ブラウザでWebRTC - iOSゲートウェイ作ってみた

何を隠そう元ネタは私です。
俺のは音声だけで、がねこさんのは映像もついてるパワーアップ版。

WebAudioでなんちゃってWebRTCする

  • iOS側からは、簡単なリアクションを送信できる
  • ビデオは2秒ごと
  • 通信量が尋常じゃないので、その圧縮がキモ
    • 映像はJPEG
    • 音声はmp3に(μ-lawより圧縮率がよかった
  • 映像: 56kbps 音声: 36kbpsまで落として、弱い回線でもなんとか

いやーさすがですねー。