资讯专栏INFORMATION COLUMN

魔方实时通信一对一音视频组件

Steve_Wang_ / 2761人阅读

摘要:魔方实时通信协作引擎是一个全能力的实时云端协作引擎魔方实时通信,请点击这个继上一个聊天组件增加了发动语音,语音视频通话功能项目的源代码在这里在线演示项目结构如下直接打开浏览器访问页面,效果图如下音视屏通话效果复制就可以用了登录中。。。

魔方实时通信/协作引擎(Web SDK)是一个全能力的实时云端协作引擎

魔方实时通信,请点击这个

继上一个im聊天组件增加了发动语音,语音视频通话功能

项目的源代码在这里

在线演示

项目结构如下:

直接打开浏览器访问index.html页面,效果图如下:

音视屏通话效果:

复制index.html就可以用了:




    
        
        
        
        
        
    

    

        
登录中。。。

在启动之前,你只需要引入需要的各个js文件。

lib/Genie-min.js 为引擎依赖库

lib/cube-core.js 引擎核心库

lib/cube-message.js 即时消息库

lib/cube-signaling.js 音视频通话

lib/cube-sipworker.js 会议模块

base/base.js 用户登录的相关信息配置(loginInfo里面的信息去时信魔方官网注册获取)

base/message.js 定义一个 AppMessageListener 来监听消息的收取、发送、文件上传、消息撤回等各种事件

component/CubeMessage.js 自定义元素的js

在html引入我们所需要的js,使用`
`聊天界面就搭建好了。

你可以根据需求是否需要发送图片,文件等消息类型

在cube-message标签上添加 sendImg属性就可以发送图片

在cube-message标签上添加 sendFile属性就可以发送文件

在cube-message标签上添加 sendAudio属性就可以发送语音消息

在cube-message标签上添加 sendVoice属性就可以语音通话

在cube-message标签上添加 sendVideo属性就可以视频通话

注意】:新版本的视频获取接口要用HTTPS协议,否则会抛出错误,当然现在在本地访问通过 localhost, 127.0.0.1 或者文件协议,都可以正常使用

capturing_audio_video.html:28 getUserMedia() no longer works on insecure origins. To use this feature, you should consider switching your application to a secure origin, such as HTTPS. See https://goo.gl/rStTGz for more details.

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/100275.html

相关文章

  • 魔方实时通信im组件

    摘要:魔方实时通信协作引擎是一个全能力的实时云端协作引擎魔方实时通信,请点击这个这个可以是实现的功能有很多,目前我就先写一个聊天的组件,后续组件慢慢来项目的源代码在这里在线演示项目结构如下直接打开浏览器访问页面,效果图如下登录中。。。 魔方实时通信/协作引擎(Web SDK)是一个全能力的实时云端协作引擎 魔方实时通信,请点击这个 这个SDK可以是实现的功能有很多,目前我就先写一个聊天的组件...

    light 评论0 收藏0
  • 魔方实时通信im组件

    摘要:为引擎依赖库引擎核心库即时消息库用户登录的相关信息配置里面的信息去时信魔方官网注册获取定义一个来监听消息的收取发送文件上传消息撤回等各种事件自定义元素的在引入我们所需要的,使用聊天界面就搭建好了。 魔方实时通信/协作引擎(Web SDK)是一个全能力的实时云端协作引擎 魔方实时通信,请点击这个 这个SDK可以是实现的功能有很多,目前我就先写一个聊天的组件,后续组件慢慢来~ ~ ~ 项目...

    only_do 评论0 收藏0
  • “小程序+直播”怎样搅动视频技术生态?

    摘要:与原生应用和基于浏览器的应用相比,小程序直播会对音视频技术生态带来哪些影响微信天生的流量优势会给开发者和运营带来机会还是陷阱邀请了若干位有代表性的技术人,分享各自的观点与思考。姜雨晴小程序提供的实时音视频是一种的技术解决方案。 ​责编 / 王宇豪策划 / LiveVideoStack 12月26日晚间,微信小程序开放了直播能力,并首先向社交、教育、医疗、政务民生、金融等五大应用场景开放...

    xorpay 评论0 收藏0
  • 发现一个非常好用的RTC(实时视频通信)方案,做直播和视频通话都很牛

    摘要:除了一些线程调度和线程模型的调整,我们还需要进行业务逻辑上的优化,比如缩减高消耗,低反馈的业务模块,降低消耗,限制业务逻辑队列内存分配增长空间,避免某些业务场景中内存持续增长导致系统奔溃。 1、HaaS RTC背景介绍 HaaS RTC是阿里云IoT联合视频云开发的IoT设备端上的实时通...

    LeviDing 评论0 收藏0
  • 更懂在线互动课堂,UCloud优刻得推出URTC实时视频

    摘要:微软雅黑宋体除在线教育外,也可满足语音和视频社交远程医疗视频会议娱乐直播等多种业务场景需要,后续将持续推出多行业的实时音视频解决方案。微软雅黑宋体目前已上线公测,且每月万分钟内免费,登录优刻得官网即可了解更多产品功能及价格信息。近日,中立云服务平台UCloud优刻得正式推出URTC(UCloud Real-Time Communication)实时音视频产品,依托于UCloud优刻得强大的云...

    imtianx 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<