在網(wǎng)頁(yè)上用websocket播放RTSP實(shí)時(shí)流 性能優(yōu)化 進(jìn)階方案
上篇文章，介紹了提高 視頻流播放性能 的進(jìn)階方案， 現(xiàn)在實(shí)現(xiàn)一個(gè)完整的項(xiàng)目。
- 使用Tornado開(kāi)發(fā)websocket服務(wù)
- 使用Opencv對(duì)RTSP流進(jìn)行解碼
- 前端ArrayBuffer讀取二進(jìn)制數(shù)據(jù)， 轉(zhuǎn)為Blob對(duì)象
- FileReader讀取Blob為base64字符串，由img標(biāo)簽顯示圖片
Torando 在高版本5.0+ ， 在A(yíng)pplication中加入線(xiàn)程，會(huì)出現(xiàn) RuntimeError: There is no current event loop in thread 'Thread-1'.錯(cuò)誤， 建議降低版本為4.5
開(kāi)發(fā)環(huán)境
Python3.7
解碼視頻流
使用 imutils 庫(kù)解碼視頻流，提高解碼速度。
將得到的圖片轉(zhuǎn)為字節(jié)存儲(chǔ)到進(jìn)程間共享隊(duì)列 multiprocessing.Queue() 中
image.png
推送服務(wù)
從隊(duì)列中取出后，調(diào)用 websocket write_message 發(fā)送
image.png
Websocket服務(wù)
image.png
前端JS
websocket 連接設(shè)置 binaryType: 'blob'
FileReader 讀取二進(jìn)制數(shù)據(jù)為ArrayBuffer
image.png
轉(zhuǎn)為Blob對(duì)象
image.png
展示在前端 img 標(biāo)簽
image.png
這樣就可以實(shí)現(xiàn)網(wǎng)頁(yè)播放實(shí)時(shí)RTSP視頻流啦。
完整代碼git地址：tornado_websocket_stream
