第十二屆 佳作

software-dev
菜雞前端邁入網頁即時通訊(WebRTC)之旅
早晨來杯咖啡

系列文章

DAY 1

WebRTC之旅:始

前言 自從新冠病毒疫情爆發後,疫情持續延燒,Amazon、Microsoft、Facebook、Google 等科技巨頭為了員工健康與社會安全紛紛呼籲員工在家...

DAY 2

[知識篇] 何謂 WebRTC

將由淺入深來了解 WebRTC 的面貌 WebRTC (Web Real-Time Communication) WebRTC (Web Real-Time...

DAY 3

[知識篇]淺談即時網頁通訊技術 - Polling / WebSocket / WebRTC

即時網頁通訊技術 以平常我們熟知的HTTP協定(HTTP protocol)為例,溝通方式是必須由Client主動通知Server,但Server是無法主動發送...

DAY 4

[知識篇]WebRTC - JavaScript APIs

學習目標 主要了解 WebRTC 包含了哪些 JavaScript APIs,才能用來為網頁提供更多的多媒體應用,如:音視訊會議,檔案傳輸等。 APIs 這邊...

DAY 5

[知識篇] MediaStreams API - getUserMedia 介紹

學習目標 本章你將會了解到: getUserMedia 包含哪些功能 如何使用getUserMedia來擷取本機影音流(Video/Audio stream...

DAY 6

[知識篇]MediaStreams API - getUserMedia 相容性處理

MediaStreams APIs經過演變更新下,新舊版api略微不同,getUserMedia也是其中之一,包含其參數constraints,因為是基於Med...

DAY 7

[知識篇] MediaStreams API - MediaStream Object

學習目標 了解 MediaStream 物件以及其 MediaStreamTrack object 如何利用 getUserMedia 取得 MediaStr...

DAY 8

[知識篇]MediaStreams API - MediaStreamTrack Object

學習目標 了解 MediaStreamTrack 物件包含了哪些屬性及功能 還不知道如何取得MediaStreamTrack 物件的話,可以先觀看該章節...

DAY 9

[實作篇]MediaStreams API - 基本應用(搭配canvas)

學習目標 如何利用 getUserMedia API 實作簡單的canvas應用 實作 接下來會展示一些簡單實作,主要是熟悉能透過getUserMedia...

DAY 10

[實作篇]MediaStreams API - 基本應用(搭配CSS filter)

學習目標 如何利用 CSS filter 搭配video element做出濾鏡效果 實作 接下來會展示簡單實作並搭配CSS filter屬性,注意: 這...