Web项目引入Agora SDK实现视频通话功能

零、前言

       简介：声网， Agora。一个专注移动端的高清实时通话云服务解决方案。

     （1）声网Agora成立于2013年，是实时音视频云行业开创者和全球领先的专业PaaS服务商。开发者只需简单调用Agora API，30分钟即可在应用内构建多种实时音视频互动场景。

     （2）声网的服务覆盖社交直播、在线教育、企业协作、IoT、医疗、游戏、保险等10余行业，共计100多种场景。实时互动技术服务覆盖全球200多个国家和地区，并在当地提供技术和运营支持。使用声网服务的企业包括小米、陌陌、抖音、新东方、VIPKID、好未来等公司。疫情期间，声网日均通话分钟数较日常增长近一倍，达15.6亿分钟(按流计时为62.4亿分钟)。-----摘抄自百度百科。

     （3）浏览器的安全策略对除 127.0.0.1 以外的 HTTP 地址作了限制，Agora Web sdk 仅支持 HTTPS 协议以及 http://localhost，请勿使用 HTTP 协议部署你的项目。

一、官网地址以及github地址

      官网：https://www.agora.io/cn/

      github-demo：https://github.com/AgoraIO/Basic-Video-Call

二、支持

      Android、ios、mac、window、web均提供相关sdk。

三、demo

      以web端为例，vue项目进行介绍。

    （1）download官网vue相关demo；

      项目结构如下图：

扫描二维码关注公众号，回复： 11343879 查看本文章

执行命令：

//下载依赖
npm install

    （2）官网进行注册，实名认证，并创建一个项目；

    （3）根据appid与项目名称、创建频道、生成一个临时toke；

点击项目管理，进入到项目详情页

 点击2进入页面生成token：

     （4）填写参数点击加入频道

执行 npm run serve 运行起来，最终页面如下：

我们填入相关参数，并打开两个页面模拟两个用户进行视频通话。

再加入一个用户的效果：

 好了，基本介绍到这里，快去搭建你的视频或者语音通话应用吧。

四、总结

       简单介绍了利用声网sdk搭建音视频通话应用的简单流程，由于声网是收费的，有时常限制，所以个人用户可以简单玩，企业可以购买使用。

五、demo地址

github：链接: https://pan.baidu.com/s/1TlyG0HqHzNJ73yj6bRaxKA 提取码: vquw