MacでWebRTCが繋がらなかったので、原因を調べた話

はじめに

先日、WebRTC Singaling Server AyameのSaaSがリリースされていたので動かしてみたところ、何故か繋がりませんでした。
medium.com

色々と調べてみたところ、原因は灯台下暗しだったので、記録としてまとめておきます。

症状

• Ayameのサンプル実行時に ICE connection Status has changed to failedとコンソールに出力される
• WebRTC samplesのPeer connectionもiceConnectionStateがfailedになる
• WebRTC Troubleshooterでチェックしたところ、ConnectivityのHost connectivityだけが[ FAILED ] Timed outとなる
• Chrome(stable,canary)、Firefox、Safari、いずれも動作しない
• Macのみで動作しない。Windows、Androidは動作する。

WebRTC Troubleshooterの結果

原因

結論から言うと、「Macのファイアウォール」でした。
システム環境設定→セキュリティとプライバシー→ファイアウォールにある「ファイアウォールオプション」をクリックし、「外部からの接続を全てブロック」のチェックを外せばOKです。
Ayameは全く悪くないです。

調べたこと

1. Ayame関連
   1. Ayameのバージョンを下げてみる
      1. 変化なし
   2. 他のAyameのサンプルを動かしてみる(web-sdk、react-sample)
      1. 変化なし
   3. SaaSではなく、ローカルでAyameを動かしてみる
      1. 変化なし
2. ブラウザ関連
   1. 複数のブラウザを試す
      1. Chrome(stable、canary)、Firefox、Safari(いずれも最新版)で動かしてみる
      2. 変化なし
   2. chrome://webrtc-internalsを見てみる
      1. シグナリングは出来ているように見えた
   3. chrome://net-exportでネットワーク関連のログを記録してみる
      1. GoogleのSTUNサーバーに接続していることぐらいしか分からなかった
3. 他のソフト関連
   1. ウイルス対策ソフトを無効化してみる
      1. Symantec Endpoint Protection(大学から配布されているもの)を一時的に無効化
      2. 変化なし
   2. ファイアウォールの設定を変えてみる
      1. 前述の通り、これが原因でした
4. OS関連
   1. 他のOSで動かしてみる
      1. Android、Windowsで動かしてみる
      2. 正常に動作したため、macOS固有の問題であることを確認
   2. macOSのリリースノートを見てみる
      1. 関係がありそうな変更は見つけられなかった
5. ハードウェア関連
   1. モバイル回線(テザリング)を使ってみる
      1. 変化なし
   2. NICを変えてみる(WiFi→有線)
      1. 変化なし
6. その他
   1. 一晩置いてみる(寝る)
      1. 「何故か動いている」を期待した
      2. 変化なし

終わりに

もう少し知識があれば、もっと早く原因を特定できたかもしれません。
WebRTCの動作検証では、L1からL7まで様々な知識が求められるのでとても大変でした。
まさに「総合格闘技」ですね。
AyameはWebRTC Native Client Momoと組み合わせて動かすこともできるようなので、ラズパイから簡単に映像配信ができるようになりそうです。
今後も目が離せないですね!

2022/02/12 追記

公式のWebRTC Troubleshooterが閉鎖されていたため、自分でホストしているものにURLを差し替えました。