PixelStreamer魔改自虛幻引擎的“SignallingWebServer”：
Epic Games\UE_4.26\Engine\Source\Programs\PixelStreaming\WebServers\SignallingWebServer
即信令網頁服務器，刪除了其中90%以上的無用代碼和庫，解決了許多bug，成就了一個超輕量，上手即用的像素流前端庫和信令服務器。
先複習一下WebRTC技術，相關內容推薦：
類型 |
即時性 |
數據量 |
場景 |
通訊 |
低 |
小 |
http網頁、文件傳輸、Email |
即時通訊 |
高 |
小 |
聊天室、電話、RTS網絡遊戲 |
即時音視頻通訊 |
高 |
大 |
視頻通訊、遠程桌面、3D像素流 |
WebRTC主要是爲了解決“即時音視頻通訊”的需求的，這類需求要求極低的延遲，單位時間內的數據量又很大，所以非常挑戰壓縮算法。
像素流協議
PixelStreamer最核心的基礎組件是虛幻引擎像素流插件定義的“像素流協議”，其中分2個部分，分別是基於DataChannel的二進制消息格式，和基於WebSocket和信令服務器之間的JSON格式。
DataChannel二進制協議格式：
https://github.com/EpicGames/UnrealEngine/blob/release/Engine/Plugins/Media/PixelStreaming/Source/PixelStreaming/Private/ProtocolDefs.h
鍵盤映射定義：
https://github.com/EpicGames/UnrealEngine/blob/release/Engine/Plugins/Media/PixelStreaming/Source/PixelStreaming/Private/JavaScriptKeyCodes.inl
整體架構
沉浸式鼠標API是一個黑科技，當指定一個dom元素進入PointerLock之後，鼠標隱藏掉，同時鼠標的運動感知不到元素的邊界，即在任意方向上可以無線運動，這種使用體驗很符合3D人物的操作習慣。
目前主流的會話憑證是利用localStorage+Authoriation頭部實現JWT的存儲，很遺憾，這3樣東西都是文本格式的，如果想要存儲爲二進制格式，需要另3樣技術：CachesAPI、http2.0、二進制token格式。
項目地址：https://github.com/JinHengyu/PixelStreamer
本文分享自微信公衆號 - WebHub（myWebHub）。
如有侵權，請聯繫 [email protected] 刪除。
本文參與“OSC源創計劃”，歡迎正在閱讀的你也加入，一起分享。