websocket聊天體驗(二)


上一篇說到后續可以支持:最近歷史、表情+圖片,順便還實現了簡易的音頻和視頻。暫時沒有實現實時語音對講,有待后續再研究。點開在線聊天頁面,即可看到最近歷史記錄(18條)。

聊天的底層數據都是基於txt文本,表情+圖片使用<img src=”base64”/>提供支持,“表情”其實是支持本地圖片上傳,“圖片”其實是支持屏幕截圖(從剪貼板獲取圖片),然后通過js轉碼為base64字符串,通過websocket發送到聊天室即可。

image

socket對象使用了ReconnectingWebSocket開源組件來獲取,同時還使用了recorder組件來實現錄音功能。

image

使用了MediaRecorder來獲取視頻(可以在頁面查看源碼,這里圖片排版較好一點)

image

下面是控制按鈕:點擊開始錄制,松開立即發送。

image

如果發送之后不想別人看見怎么辦?歷史只有18條,發送幾十條其他文字覆蓋即可。


后續實時語音對講待研究。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM