查看详情

Vue-core-video-player support HLS format now

As is known to us. HLS is an important video format for all big video service platform for Apple, Netflix and Tencent Video Entertainment. HLS is a media streaming protocol for delivering visual and audio media to viewers over the internet. HLS protocol chops up MP4 video content into short (10-second) chunks with the .ts file 详情 »

查看详情

移动平均(EWMA)在 HLS.JS 的实践

才开始大家一直在想,什么是移动均线? 哪里会用到?? 对于常规的页面,实际上很难说需要到具体到有需要用到 网络宽带的预估,但是对于流媒体或者上传服务时候,这个就很重要了,我们需要根据不同网速情况,做策略上的更改,从而改善体验。 做视频播放的很多童鞋,经常在 Youtube 上看到这么一个仪表盘,界面。 大家会看到网速的实际情况。 如果叫大家来实现,实际上,或许很轻而易举会想到用一个网络资源的请求,和时间来完成做一次除法就OK了。 const start = Date.now() fetch(url, {}).then((result) => { const end = Date.now(); const bw = length / (end - start) * 8000; }) 似乎,这样就可以表示一个当前分片的网速了,但是我们实际上并不会用当前的瞬时值作为一个衡量当前宽带是否满足我们播放某种清晰度的标准。 而 hls.js 巧妙的借鉴了 移动平均 来反映当前网络的一个趋势。 移动平均 移动平均(moving average,MA),又称“ 详情 »

查看详情

HLS.JS 自定义 分片 TS 请求 URL

很早之前写过 hls.js 源码解读【1】 ,基本分析了 hls.js 这个库的设计和实现。阅读源码一方面是为了吸收对方设计或者编码上的优点,当然也有可能是另外一个原因,就是一些需求从表面的文档里找不到具体的实现思路。 默认情况下,我们并不需要对解析出来的 ts 分片地址做改造,但是如果真的需要的话,其实有两个思路。 思路 1 复写 Loader 。 自己实现一个关于请求的 Loader ,通过配置传入类似; class XhrLoader extends Hls.DefaultConfig.loader { constructor(config) { super(config); var load = this.load.bind(this); this.load = function(context, config, callbacks) { // your code to handle context.url load(context,config, 详情 »