專案中需要實現視訊通話功能,經過公司的賽選,採用網易雲信的視訊通話服務,app小夥伴整合很順利。web端需要實現呼叫app端使用者。網易雲信文件介紹不全,vue的demo滿足不了需求,和客服人員溝通,只能通過整合呼叫元件來實現了。
這個demo是vue版本,可以實現視訊通話,但是是加入聊天房間的方式,沒有呼叫功能。
https://github.com/netease-im/Basic-Video-Call/tree/master/One-to-One-Video/NERtcSample-1to1-Web-Vue
本著不能重複造輪子的想法,先在網上找了一圈的文章和程式碼,可惜一無所獲,所以只能自己動手了,在demo基礎上進行修改。
採用官方元件地址:
https://github.com/netease-kit/documents/blob/main/%E4%B8%9A%E5%8A%A1%E7%BB%84%E4%BB%B6/%E5%91%BC%E5%8F%AB%E7%BB%84%E4%BB%B6/%E5%BC%80%E5%8F%91%E6%96%87%E6%A1%A3/%E5%BF%AB%E9%80%9F%E9%9B%86%E6%88%90/%E9%9B%86%E6%88%90%E5%88%B0%E9%A1%B9%E7%9B%AE_Web.md
這個裡面的介紹點選下載元件下載的js只有一個還缺少兩個js。 (這三個js,引入方式不同自行選擇)
如果選擇index.esm.js,使用import方式引用,記得檢視此路徑是否正確。
剩餘兩個js的下載方式是,在這個地址中
https://github.com/netease-kit/NIM_Web_Demo/tree/feature-g2-new
將所有js程式碼引入進來後,就可以對照文件介面進行開發了。
第一步:引用js
第二步:建立例項,配置資訊,登入
第三步:配置相應的事件
第四步:呼叫指定人員
下面是介面顯示:
當然後面還有細節需要去完善,比如開關靜音,視訊等.. 還有後面的token調取後臺鑑權等.......