上一篇說到后續可以支持:最近歷史、表情+圖片,順便還實現了簡易的音頻和視頻。暫時沒有實現實時語音對講,有待后續再研究。點開在線聊天頁面,即可看到最近歷史記錄(18條)。
聊天的底層數據都是基於txt文本,表情+圖片使用<img src=”base64”/>提供支持,“表情”其實是支持本地圖片上傳,“圖片”其實是支持屏幕截圖(從剪貼板獲取圖片),然后通過js轉碼為base64字符串,通過websocket發送到聊天室即可。
socket對象使用了ReconnectingWebSocket開源組件來獲取,同時還使用了recorder組件來實現錄音功能。
使用了MediaRecorder來獲取視頻(可以在頁面查看源碼,這里圖片排版較好一點)
下面是控制按鈕:點擊開始錄制,松開立即發送。
如果發送之后不想別人看見怎么辦?歷史只有18條,發送幾十條其他文字覆蓋即可。
后續實時語音對講待研究。