Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
3分でわかる WebRTCのP2P通信
Search
koz
July 21, 2021
Technology
0
70
3分でわかる WebRTCのP2P通信
3分間LTで発表した資料
WebRTCのP2Pについて調べたので作成した
koz
July 21, 2021
Tweet
Share
More Decks by koz
See All by koz
Angularの雰囲気を伝えたい
koz
0
48
TypeScriptに興味を持って欲しいスライド
koz
0
230
Other Decks in Technology
See All in Technology
技術的負債解消の取り組みと専門チームのお話 #技術的負債_Findy
bengo4com
1
1.2k
Developer Summit 2025 [14-D-1] Yuki Hattori
yuhattor
19
5.8k
開発スピードは上がっている…品質はどうする? スピードと品質を両立させるためのプロダクト開発の進め方とは #DevSumi #DevSumiB / Agile And Quality
nihonbuson
2
2.4k
マルチモーダル理解と生成の統合 DeepSeek Janus, etc... / Multimodal Understanding and Generation Integration
hiroga
0
370
Nekko Cloud、 これまでとこれから ~学生サークルが作る、 小さなクラウド
logica0419
2
880
MC906491 を見据えた Microsoft Entra Connect アップグレード対応
tamaiyutaro
1
520
SA Night #2 FinatextのSA思想/SA Night #2 Finatext session
satoshiimai
1
130
飲食店予約台帳を支えるインタラクティブ UI 設計と実装
siropaca
7
1.6k
Oracle Base Database Service 技術詳細
oracle4engineer
PRO
6
57k
速くて安いWebサイトを作る
nishiharatsubasa
9
11k
Moved to https://speakerdeck.com/toshihue/presales-engineer-career-bridging-tech-biz-ja
toshihue
2
670
目の前の仕事と向き合うことで成長できる - 仕事とスキルを広げる / Every little bit counts
soudai
24
6.6k
Featured
See All Featured
Measuring & Analyzing Core Web Vitals
bluesmoon
6
240
Fireside Chat
paigeccino
34
3.2k
Become a Pro
speakerdeck
PRO
26
5.1k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
28
9.3k
Large-scale JavaScript Application Architecture
addyosmani
510
110k
Done Done
chrislema
182
16k
Raft: Consensus for Rubyists
vanstee
137
6.8k
Building a Scalable Design System with Sketch
lauravandoore
460
33k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
251
21k
Adopting Sorbet at Scale
ufuk
74
9.2k
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
3.7k
The MySQL Ecosystem @ GitHub 2015
samlambert
250
12k
Transcript
3分でわかる WebRTCのP2P通信
自己紹介 kozです。
WebRTCについて
WebRTC とは ブラウザ同士でリアルタイムに通信を行う仕組みのこと。 WebRTCのP2P通信の仕組みを簡単に説明し、完全に理解します。
通信方式 - P2P(Peer To Peer) - クライアント同士が映像 /音声を通信する - 今回はこれの紹介
- SFU(Selective Forwarding Unit) - サーバが映像/音声を中継してくれる - MCU(Multi-point Control Unit) - サーバーが映像/音声の処理をしてから配信してくれる
用語整理
登場人物 • Peer • STUN • シグナリング
Peer クライアントのこと。 ここでは、ボブとアリスとする。 ボブ アリス
シグナリング P2Pに必要な情報をやり取りする仕組み。 シグナリングサーバーを経由する。 方式は問わない。
STUN PeerのIP/Portを知るためのもの。 NAT越えに必要。
通信の流れ
その1 - シグナリング準備
その2 - Offerを送る Offer Offer
その3 - Anserを受け取る Answer Answer
その4 - STUNに問い合わせる Who am I ? Who am I
?
その5 - STUNから情報を受け取る Your IP & Port Your IP &
Port
その6 - 経路情報を交換する Candi date Candi date
その7 - P2Pでの通信開始!!!🎉 Data
まとめ WebRTCのP2P通信の仕組みを簡単に説明しました。 P2Pするために実際には、サーバーを介しての情報をやりとりするという手順を踏む必 要があるというのがわかったと思います。 実際にはまだ登場人物がいたりするので、興味があれば調べてみてください。 おしまい。