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
WebSocketでカメラの映像を共有してみた
Search
Sponsored
·
SiteGround - Reliable hosting with speed, security, and support you can count on.
→
onozaty
February 28, 2018
Programming
0
40
WebSocketでカメラの映像を共有してみた
WebSocketのバイナリメッセージとWebRTCのカメラを利用して、映像の共有をしてみました
onozaty
February 28, 2018
Tweet
Share
More Decks by onozaty
See All by onozaty
Dev Containers のススメ
onozaty
0
14
リモートワーク中に買って良かったものベスト3
onozaty
0
190
情報を表現するときのポイント
onozaty
0
27
チームで開発するための環境を整える
onozaty
1
320
Selenium入門(2023年版)
onozaty
1
200
40歳過ぎてもエンジニアでいるためにやっていること
onozaty
0
72
Java8から17へ
onozaty
0
22
今からでも遅くないDBマイグレーション - Flyway と SchemaSpy の紹介 -
onozaty
0
240
Redmine issue assign notice plugin の紹介
onozaty
0
240
Other Decks in Programming
See All in Programming
AWS Infrastructure as Code の新機能 2025 総まとめ 〜SA 4人による怒涛のデモ祭り〜
konokenj
10
3.3k
日本だけで解禁されているアプリ起動の方法
ryunakayama
0
370
モジュラモノリスにおける境界をGoのinternalパッケージで守る
magavel
0
3.5k
オブザーバビリティ駆動開発って実際どうなの?
yohfee
3
750
開発ステップを細分化する、破綻しないAI開発体制
kspace
0
110
AIコーディングの理想と現実 2026 | AI Coding: Expectations vs. Reality 2026
tomohisa
0
1.2k
API Platformを活用したPHPによる本格的なWeb API開発 / api-platform-book-intro
ttskch
1
130
Geminiの機能を調べ尽くしてみた
naruyoshimi
0
200
AIプロダクト時代のQAエンジニアに求められること
imtnd
2
750
Ruby x Terminal
a_matsuda
7
590
20260228_JAWS_Beginner_Kansai
takuyay0ne
5
460
あなたはユーザーではない #PdENight
kajitack
4
340
Featured
See All Featured
The Director’s Chair: Orchestrating AI for Truly Effective Learning
tmiket
1
120
How to optimise 3,500 product descriptions for ecommerce in one day using ChatGPT
katarinadahlin
PRO
1
3.5k
Stop Working from a Prison Cell
hatefulcrawdad
274
21k
Design of three-dimensional binary manipulators for pick-and-place task avoiding obstacles (IECON2024)
konakalab
0
380
Future Trends and Review - Lecture 12 - Web Technologies (1019888BNR)
signer
PRO
0
3.3k
We Have a Design System, Now What?
morganepeng
55
8k
Building Better People: How to give real-time feedback that sticks.
wjessup
370
20k
The Illustrated Children's Guide to Kubernetes
chrisshort
51
52k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
31
3.1k
Building Adaptive Systems
keathley
44
2.9k
SEO Brein meetup: CTRL+C is not how to scale international SEO
lindahogenes
0
2.4k
Scaling GitHub
holman
464
140k
Transcript
WebSocketͰ Χϝϥͷө૾Λ ڞ༗ͯ͠Έͨ 2018-02-28 ࣾษڧձ onozaty
WebSocket • αʔόͱΫϥΠΞϯτؒͰํ௨৴Λߦ͏ ٕज़ • 1ͭͷίωΫγϣϯͰํ௨৴͕ߦ͑Δ • ϦΞϧλΠϜͳ௨৴Λ࣮ݱͰ͖Δ
ͲΜͳͷʹ͍ͯΔ͔ • ϦΞϧλΠϜʹใΛΓͱΓ͍ͨ͠ͷ • ͨͱ͑ΦϯϥΠϯήʔϜͱ͔
ϒϥβͷରԠঢ়گ Ҿ༻ݩ: https://developer.mozilla.org/ja/docs/Web/API/WebSockets_API#Browser_compatibility
ͱΓ͋͑ͣ Կ͔࡞ͬͯΈ͍ͨ
࠷ॳʹ࡞ͬͨͷ • WebSocketͷࡐʹΑ͕͋͘ΔνϟοτΛ ࡞ͬͯΈͨ • αʔόSpring BootͰ • https://github.com/onozaty/spring-boot-sandbox/ tree/master/spring-boot-websocket
͋·Γʹ؆୯͗ͨ͢
ଞͷࡐΛ୳ͦ͏
ଞͷࡐΛߟ͑Δ • WebSocketόΠφϦϝοηʔδඈͤΔ ͱ͍͏ͷ͕໘നͦ͏ • ΧϝϥWebRTCʹؔ࿈ͯ͠؆୯ʹૢ࡞Ͱ͖ ΔΑ͏ʹͳ͍ͬͯΔΒ͍͠ͷͰɺͦΕҰॹ ʹࢼͤΕ
ΧϝϥͰࡱӨͨ͠ը૾Λ WebSocketͰڞ༗͢Δ
ཁ݅ • ΫϥΠΞϯτؒͰΧϝϥͷө૾Λڞ༗͢Δ • ϦΞϧλΠϜʹߋ৽͠ɺಈըͬΆ͘ݟͤΕΔ Α͏ʹ
αʔόଆͷ࣮ • ड৴ͨ͠όΠφϦσʔλ(ը૾)ʹɺૹ৴ݩΛҰ ҙʹࣝผ͢ΔใΛ༩ͨ͠͏͑ͰɺશΫϥ ΠΞϯτʹϒϩʔυΩϟετ • ΫϥΠΞϯτ͔ΒஅΛݕͨ͠Βɺۭͷσʔ λΛશΫϥΠΞϯτʹૹͬͯදࣔ༰ΛϦηο τ
ΫϥΠΞϯτଆͷ࣮ • getUserMedia()Λ௨ͯ͡ΧϝϥͷσόΠεΛऔ ಘ͠ɺ<video>Ͱಈըͱͯ͠දࣔ • ҰఆपظͰ<video>ͷ༰Λ<canvas>ʹॻ͖ࠐ ΜͰɺjpegը૾ͷόΠφϦʹͯ͠αʔόʹૹ৴ • αʔόଆ͔Βड͚औͬͨը૾ɺόΠφϦͷઌ ಄෦ʹ༩͞Εͨૹ৴ݩΛࣝผ͢ΔใΛݩ
ʹɺૹ৴ݩຖʹදࣔ
ৄ͍͠༰ Լهͷίʔυࢀর https://github.com/onozaty/shared-camera-websocket/ tree/master/shared-camera-server
σϞ
σϞ • ԼهͷϓϩδΣΫτΛHerokuͰσϓϩΠ • https://github.com/onozaty/shared-camera-websocket • ը૾Λେྔʹ৴͢Δ͜ͱʹͳΔͷͰɺ௨৴ ྔʹҙ • ΪΨ͕ݮΔ
ը໘Πϝʔδ
ײ • ΧϝϥΛJavaScript͔Β৮ΔͷɺࢥͬͨҎ্ ʹ؆୯ͩͬͨ • όΠφϦϝοηʔδΛΓͱΓͰ͖Δͷɺ ͍Ζ͍ΖԠ༻͕͖͖ͦ͏ • Herokuศར
͓·͚ • ࠓճͷσϞͰΒͳ͔͕ͬͨɺRaspberry Piʹ ଓͨ͠Χϝϥ͔Β৴͢ΔΫϥΠΞϯτ࡞ͬͨ • Ұ൪ۤઓͨ͠ͷ͜͜ • Node.jsɺPythonɺJavaͱࢼ͢ϋϝʹ •
͜ΕΛ͏ͱɺՈʹ͓͍ͨRaspberry PiͷΧϝϥͰ ࡱӨͨ͠ը૾Λඈͯ͠ɺ֎ग़ઌ͔Β֬ೝ͢ΔΑ͏ ͳ͜ͱͰ͖Δ