经过前面的知识,基本已经把聊天室的功能搞定了,剩下的就是直播的问题了...

一如既往,阿里云的web demo也是少的可怜,只有一个web播放器(Prismplayer),所以这里主要就此播放器踩的坑分享下...

1.获取直播流地址

目前此播放器有两种模式:

  FLASH(pc端):

    支持视频格式: mp4、flv、m3u8、rtmp、mp3

  HTML5 :

    支持视频格式:  mp4、m3u8

所以那些用rtmp的最好转成m3u8来播放

同样的,不同模式引入不同js文件,如果两个都用,阿里也有提供同时支持两个的版本

传送门------阿里云web播放器

转好格式后,最好添加鉴权,至于是md5,rot13......自行选择

2.使用播放器

播放器使用方法也很简单

// 初始化播放器
var player = new prismplayer({
id: "J_prismPlayer", // 容器id
source: "http://cloud.video.taobao.com/play/u/2554695624/p/1/e/6/t/1/fv/102/28552077.mp4",// 视频地址
autoplay: false, //自动播放:否
width: "100%", // 播放器宽度
height: "400px", // 播放器高度
isLive: true //是否直播
});

将source替换成自己的直播地址即可,至于播放器的方法使用,大家去上方的传送门看就好,这里就不多概述了...

需要注意的是:

当是直播模式的时候,若大家调用 liveStreamStop 方法与 m3u8Retry 方法时,pc与移动端差距略大

pc端可能即时就反馈给你,而移动端需要等待一阵时间

自动播放模式兼容性(移动端)极差,几乎属于摆设,暂时还未找到好的自动播放的方法,若有人解决,希望回复下,谢谢

另外说一下X5浏览器,视频会自动全屏,ios还可以控制,安卓没有法子,关于这个问题,腾讯给的回复是开启同层播放器,具体的方法也很简单

传送门---前端技术文档

所以其实直播就是将视频拉出来给另一个层而已...

这里讲的也就是这么多了,如果在阅读本文过程中发现有任何问题,请您务必指正,感谢万分...

30岁是谈恋爱最矛盾的年纪,往往在爱情和面包中寻找平衡点,所以,不敢踏出去寻找另一半,但爱很美好,请不要放弃

上一篇:web 直播&即时聊天------阿里云、融云(二)

下一篇:web 直播&即时聊天------腾讯云(四)

web 直播&即时聊天------阿里云、融云(三)的更多相关文章

  1. web 直播&即时聊天------阿里云、融云

    随着直播越来越火,所在公司也打算制作自己的直播,所以去了解了这方面,使用后发现还是有些问题需要记录的. 经过分析,制作直播应该是分为两块来做,即直播与实时评论.这里先去制作实时评论,等直播ok后,也会 ...

  2. web 直播&即时聊天------阿里云、融云(二)

    上一篇简要主要介绍了融云制作聊天室的基本方法,这次基本属于对上一篇的补充以及进阶...^_^... (ps:吐槽一下,加了三个融云的线下qq群,全部没人解决问题,也不知道建此群的意义,若是民间的话就当 ...

  3. web 直播&礼物赠送------腾讯云(四)

    直播项目搁置了将近1年,以为都搁浅了,没想到头头又提起来了,这次直播技术更替为了腾讯云,消息系统没变,采用的依然是融云,新增了礼物赠送功能. 项目完成基本就是这样子: 一,播放器 由阿里云转腾讯云,w ...

  4. 克服"水土不服",融云助攻小象直播杀破"出海重围"

    2016年是直播行业被资本疯狂追逐的一年,可至今却经历着“浪潮”褪去,洗刷的不止是中小型直播平台,就连熊猫TV等有资本加持的大平台都纷纷遭遇倒闭危机.然而,直播行业作为泛娱乐的模式之一,其实本身“未死 ...

  5. 融云SDK触达用户数破20亿 王者风范双倍展现

    11月1日,融云SDK触达用户数突破20亿,业务增长速度及用户覆盖量再创即时通讯云领域新高.自去年11月10日公布SDK触达用户数破10亿以来,融云仅用了一年时间,便取得了触达用户数翻倍的成绩,迅猛的 ...

  6. 融云红包全新升级,让App用户更便捷地用“钱”交流感情!

    随着移动互联网的飞速发展,如何增强社交关系.留住用户的心已成为移动社交化时代各类App持续探索的问题,除了接入即时通讯的能力,众多社交平台开始通过趣味性十足的红包功能为App中的社交场景赋能.当即时通 ...

  7. 几款web版整合(QQ、msn、icq、yahoo通、Gtalk等)即时聊天http://hi.baidu.com/ejie/blog/item/e89794ef9a9431efce1b3ebd.html

        直到近期为止,我们经常使用的即时聊天工具(QQ.msn等)了Web版,大家不用下载庞大软件,直接打开网页就能够与自己的好友聊天,很方便.在此将时汇总,便于大家查找,节约大家一点时间. 此都是官 ...

  8. 对接融云即时通讯组件SDK,轻松实现App聊天室

    我好像特别喜欢做聊天室类的东东,刚折腾完微软的SignalR又折腾App.本来想研究研究XMPP的,由于服务器的搭建问题,先采用一个第三方的吧,看看效果如何.听到弟弟说他们公司用到了融云,我也下载个S ...

  9. ThinkPHP 提供Auth 权限管理、支付宝、微信支付、阿里oss、友盟推送、融云即时通讯、云通讯短信、Email、Excel、PDF 等等

    多功能 THinkPHP 开源框架 项目简介:使用 THinkPHP 开发项目的过程中把一些常用的功能或者第三方 sdk 整合好,开源供亲们参考,如 Auth 权限管理.支付宝.微信支付.阿里oss. ...

随机推荐

  1. 原生ajax实现http请求

      1⃣️先简单了解一下HTTP协议: http是计算机通过网络进行通信的一种规则,它是一种无状态协议(不建立持久链接,直白点儿说就是请求响应完事儿之后,链接就断开)  2⃣️一个完整的http请求有 ...

  2. jdbc ,jdbcTemplate,MyBatis,Hibernate比较与分析

    JDBC 1:jdbc(Java Data Base Connection 数据库连接)是一种用于执行sql语句的API,其中使用jdbc连接时需要的,Connection,Statement,Res ...

  3. CSS vertical-align属性

    之前也经常用到vertical-align进行垂直居中对齐,突然发现其中的一些属性值根本就没使用过,也不清楚效果,将今天的研究成果记录下. vertical-align 属性 下表是w3c上列举的属性 ...

  4. 阿里云CentOS7.2服务器的安装

    第一步:下载服务器系统ISO安装文件 我使用的是阿里云的镜像:因为阿里云的服务在国内相对比较成熟 服务器镜像下载如下:http://mirrors.aliyun.com/centos/7/isos/x ...

  5. ConcurrentHashMap、HashTable、HashMap的区别

    HashTable与ConcurrentHashMap: 相同点:都是线程安全的,可以在多线程的环境下运行.key和value都不能为null 区别:性能上的差异.HashTable每次操作对象都会锁 ...

  6. F# 之旅(上)

    写在前面的话 解答一下在上一篇文章<在Visual Studio中入门F#>中有人的提问, 1. 问:是准备写 F# 系列吗?    答:当然不是,本人也是刚刚学习 F#,只是翻译微软官方 ...

  7. 倒计时(距离活动结束还有X天X小时X分X秒)

    一个简单的倒计时,可以设定结束时间,然后自动计算出距离活动结束还有X天X小时X分X秒. 废话不多说,上代码,挺简单的,代码里有注释: // 活动倒计时 var time_end = new Date( ...

  8. 建立自己的Web service(SOAP篇)

    1.简介 这篇文章主要介绍采用SOAP来建立以及访问Web service接口. Web service是一个平台独立的,低耦合的,自包含的.基于可编程的web的应用程序,可使用开放的XML(标准通用 ...

  9. js获取宽高

    document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度 document.docume ...

  10. 如何在WebGL全景图上做标记

    WebGL可以用来做3D效果的全景图呈现,例如故宫的全景图.但有时候我们不仅仅只是呈现全景图,还需要增加互动.故宫里边可以又分了很多区域,例如外朝中路.外朝西路.外朝东路等等.我们需要在3D图上做一些 ...