直播答题html,H5实现直播答题可能吗?

原标题:H5实现直播答题可能吗?

2018年开局,以王思聪为首的一群自带话题流量的人物,在网络上争起谁是“大撒币”的称号,很难不引起舆论的注意,为了给自家的直播答题争抢流量,各大平台已经绞尽脑汁,不断在玩法上创新。这场竞争从 iOS 平台蔓延至 Android 平台。目前大多数平台通过分享邀请码下载 App 的方式获取用户。有前端开发的同学举手提问了:直播答题可以用 H5 来实现么?

本文我们试着探讨 H5 实现直播答题的可能。

什么是H5 直播答题

H5 的直播答题主要发生在三个环境下:PC 端、移动浏览器和微信端,微信端包括微信浏览器和微信小程序。开发直播答题的小程序平台,有什么好处呢?

降低参与门槛

目前大多用户都是“扫码→下载”的方式。像冲顶大会一样的独立 App 还好,如果是属于直播平台,则用户还需要再多一步才能进入游戏。做产品的人都知道,注册步骤越多会导致用户流失率越高。如果我们让用户扫码后,在 H5 端登录,率先体验游戏,直接成为我们的用户。相对于其它竞争对手来说,可以更快让新用户参与进来。

易于传播

H5 的形态更为便捷于传播,几乎零门槛的参与方式,更容易吸引和抢夺新用户。如果开发的是小程序,通过微信 9.3 亿的月活用户中分享,不难想象会产生裂变式的传播。

不过H5的直播答题同样有弊端。例如不具备通知的功能。在获得用户之后,如何留住他们需要花费一定的心思,例如登录 App 后,可获得更多复活机会等,这方面的工作就得依靠运营了。

开发H5直播答题的难点是什么?

开发H5 直播答题的难点主要有两个:

视频与答题同步

一个月前,Native App 上的视频与答题、视频和视频的同步就曾是个很大的问题,在 H5 端也会是主要难点之一。音视频流与题目是分别通过两套系统发送至 H5 端,两者的端到端延时不同,到达后让题目在主持人发出命令时就响应并显示出来,这是一个问题。目前如果想做到同步,最通用的方法就是加时间戳,但 CDN 本身不支持,需要开发者进行二次深度开发。

微信端则稍有不同,由于微信内置浏览器对视频和音频格式兼容的问题比较严重,对 H.264兼容并不好。所以我们还需要进行一次转码,再原始码流上的标签或者 SEI 数据都要转译一次。这增加了实现直播与答题同步的复杂度。

服务稳定

由于直播答题开播时在短时间内会产生高并发,需要注意节点部署,在骨干网络拥塞时进行规避。

基本的解题思路:对 PC Web 和移动浏览器的观众来讲,我们可以直接通过 CDN 方案实现。需要特别关注两点:

1.要关注边缘节点的部署以及弱网环境的传输

2.直播与题目的同步

对于非微信浏览器的观众,则需要在本地进行解码、渲染,然后进行播放。还有另一种选择,通过 Agora Web SDK 直接实现,不用担心若干服务端传输、设备适配、回声、可用度等问题,还支持高并发,完美解决直播与题目同步问题。

0eed8082897b8c2f125c5a672061ac52.png

微信端则有些不同,在微信端中打开的的观众,直播流需要进行一次 MPEG1 转码,再通过中继 Server 将视频分发到微信端,通过 JSMpeg 解码播放。使用 JSMpeg是由于它体积小,可以在大多数浏览器上顺畅运行。

dba080d7cfdcd6f13ba09dcc428be44a.png

需要注意的是,微信端用户得到的数据经过 CDN 后,还会通过转码 Server、中继 Server,对于开发者来讲又是一笔额外的成本,还会放大端到端的延时。除了 CDN 要注意部署边缘节点,转码 Server 和中继 Server 也需要部署边缘几点,所以微信 H5 端直播与答题的同步问题会加重。

如果说开发 Native 是直播答题应对目前快速竞争的“捷径”,那么开发 H5 就是获取裂变式传播新途径。

细心观察我们会发现,现在后入局的一些直播答题厂商,和去年直播抓娃娃的厂商有着高度的重合度。在抓娃娃风口时,H5 是很多厂商的首选,但是当下直播答题风口却还未出现强需求。我们分析可能出于两个原因:一是,H5抓娃娃参与门槛虽然低,但是流失率高,所以在新风口鲜有人尝试;二是,微信小程序现在已经开放了音视频接口,开发者可能会首选小程序,但现在小程序的直播权限仍有准入限制,所以发布直播答题小程序的并不多。

中睿明星课程:HTML5高级开发与应用实战

学习时间:3天

关键词:HTML5、nodeJS、redis、ECMA6、type、android、iOS、vueJS、angularJS、ionic、famo.us、bootstrap、MVVM、cordova.hbuilder

课程介绍:本课程偏向知识面的广度和系统性,设计的知识点广泛而全面,通过本课程学习,可帮助学员掌握基于Html5,在Android,iOS环境下进行跨平台移动开发的各种技术方案。以及测试,发布,部署等相关知识。返回搜狐,查看更多

责任编辑:

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值