项目中需要实现视频通话功能,经过公司的赛选,采用网易云信的视频通话服务,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调取后台鉴权等.......

对接网易云信音视频2.0呼叫组件集成到vue中,实现web端呼叫app,视频语音通话。的更多相关文章

  1. php对接网易云信视频直播

    <?php/** * Created by PhpStorm. * User: lhl * Date: 2019/4/10 * Time: 17:31 */ namespace app\api\ ...

  2. 微信 vue中使用video.js播放m3u8视频,解决安卓自动全屏的问题。

    最近一个项目中需要在微信中播放m3u8格式的视频,刚开始用了 vue-video-player 这个插件,在IOS手机体验良好,本以为完事了, 结果安卓手机一点播放就自动全屏,心态略崩.查了资料说是安 ...

  3. 音视频技术“塔尖”之争,网易云信如何C位出道?

    音视频技术“塔尖”之争,网易云信如何C位出道? 社交+美颜.抖音短视频.在线狼人杀.直播竞答.子弹短信……,过往两三年间,互联网新产品和新玩法层出不穷,风口不断切换.这些爆红的网络应用背后,都有一些共 ...

  4. 呼叫到达率100%,网易云信信令SDK免费上线!

    近期,网易云信推出一款稳定可靠.到达率高.扩展性较强的信令通道产品--信令SDK.它能够提供可靠的消息通道,可用于搭建音视频场景下的呼叫邀请机制.信令SDK目前兼容市面上所有主流的音视频SDK,呼叫到 ...

  5. 从0到1构建网易云信IM私有化

    本文来源于MOT技术管理课堂杭州站演讲实录,全文 2410 字,阅读约需 5分钟.网易云信资深研发工程师张翱从私有化面临的问题及需求说起,分享了网易云信IM私有化的解决方案和具体实践. 想要阅读更多技 ...

  6. 子弹短信光鲜的背后:网易云信首席架构师分享亿级IM平台的技术实践

    本文原文内容来自InfoQ的技术分享,本次有修订.勘误和加工,感谢原作者的分享. 1.前言 自从2018年8月20日子弹短信在锤子发布会露面之后(详见<老罗最新发布了“子弹短信”这款IM,主打熟 ...

  7. 网易云信 QUIC 加速服务架构与实践

    导语:网易云信作为音视频服务提供商的领导者,一直致力于提供顶级的音视频通话服务体验,为用户在各种恶劣环境下提供可靠的音视频服务.如何在极端弱网条件下仍然能给用户提供可靠的音视频服务,是网易云信关注的重 ...

  8. 响铃:蜗牛读书“文”、网易云信“武”:游戏之外网易的AB面

    文|曾响铃来源|科技向令说(xiangling0815) 2019年开年,网易又"搞事情"了. 近日,网易集团旗下网易云信.网易七鱼主办的"网易MCtalk泛娱乐创新峰会 ...

  9. 微信小程序开发中的二三事之网易云信IMSDK DEMO

    本文由作者邹永胜授权网易云社区发布. 简介 为了更好的展示我们即时通讯SDK强悍的能力,网易云信IM SDK微信小程序DEMO的开发就提上了日程.用产品的话说就是: 云信 IM 小程序 SDK 的能力 ...

随机推荐

  1. mysql外键策略

    1.外键 建表时添加外键:constraint 外键名 foreign key 从表字段 references 主表字段 级联操作 create table dage( create table xi ...

  2. Java实现单链表的增删查改及逆置打印

    //所提供的接口 LinkList.java package Struct; public interface LinkList {//判断链表为空public boolean linkListIsE ...

  3. 通信协议 HTTP TCP UDP

    TCP   HTTP   UDP: 都是通信协议,也就是通信时所遵守的规则,只有双方按照这个规则"说话",对方才能理解或为之服务. TCP   HTTP   UDP三者的关系: T ...

  4. 【编程思想】【设计模式】【创建模式creational】原形模式Prototype

    Python版 https://github.com/faif/python-patterns/blob/master/creational/prototype.py #!/usr/bin/env p ...

  5. Redis缓存穿透、缓存击穿以及缓存雪崩

    作为一个内存数据库,redis也总是免不了有各种各样的问题,这篇文章主要是针对其中三个问题进行讲解:缓存穿透.缓存击穿和缓存雪崩.并给出一些解决方案.这三个问题是基本问题也是面试常问问题. 这篇文章我 ...

  6. mybatis联合查询

    1.有学生实体 @Component @Scope("prototype") public class StudentInfo { private Integer studentI ...

  7. 【力扣】146. LRU缓存机制

    运用你所掌握的数据结构,设计和实现一个  LRU (最近最少使用) 缓存机制.它应该支持以下操作: 获取数据 get 和 写入数据 put . 获取数据 get(key) - 如果关键字 (key) ...

  8. 基于Github Actions + Docker + Git 的devops方案实践教程

    目录 为什么需要Devops 如何实践Devops 版本控制工具(Git) 学习使用 配置环境 源代码仓库 一台配置好环境的云服务器 SSH远程登录 在服务器上安装docker docker技术准备工 ...

  9. Jenkins环境变量

    目录 一.环境变量 二.自定义环境变量 三.自定义全局变量 四.常用变量定义 五.常用环境变量 一.环境变量 环境变量可以被看作是pipeline与Jenkins交互的媒介.比如,可以在pipelin ...

  10. Swagger如何匹配多个Controller类或者目录

    方法一(最普通的方式):匹配一个controller目录下的所有controller类. 1 @Bean 2 public Docket creatRestApi(){ 3 return new Do ...