對接網易雲信音視頻2.0呼叫組件集成到vue中,實現web端呼叫app,視頻語音通話。


項目中需要實現視頻通話功能,經過公司的賽選,采用網易雲信的視頻通話服務,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,引入方式不同自行選擇)

 

 

如果選擇index.esm.js,使用import方式引用,記得查看此路徑是否正確。

 

 

 

 

 

 

將所有js代碼引入進來后,就可以對照文檔接口進行開發了。

第一步:引用js

 

 

 第二步:創建實例,配置信息,登錄

 

 

 第三步:配置相應的事件

 

 

 第四步:呼叫指定人員

 

 

 

下面是界面顯示:

 

 

 

 

 當然后面還有細節需要去完善,比如開關靜音,視頻等..  還有后面的token調取后台鑒權等.......

 


免責聲明!

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



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