美文网首页
钉钉小程序如何实现视频流播放-HSL&.m3u8

钉钉小程序如何实现视频流播放-HSL&.m3u8

作者: 何家一枝花 | 来源:发表于2020-07-28 15:04 被阅读0次

目前视频直播微信小程序是支持的很好,钉钉小程序全网真的资源很少,官方文档也少的可怜,做个小程序真的是全网在找资源,没有UI库也是让人头疼,技术回馈也是很慢很慢,社区太差了。一个字心累

钉钉小程序目前不支持视频流组件,我们只能用video标签来实现,首先用H5来实现HLS直播流的效果,可以实现。这里面给出可以测试使用的 HLS直播流:http://ivi.bupt.edu.cn/hls/cctv1.m3u8(大家要注意这个链接,只支持HTTP默认80端口,如果是HTTPS:那么默认端口是443,视频流无法获取到,会导致钉钉小程序无法播放)

HLS:

HLS (HTTP Live Streaming)是Apple的动态码率自适应技术。主要用于PC和Apple终端的音视频服务。包括一个m3u(8)的索引文件,TS媒体分片文件和key加密串文件。下面是我下载的m3u8的播放列表文件,视频会根据这个列表来播放存储到本地的视频切片,也就是ts临时文件,这里面要说一下(安卓和苹果系统的区别,安卓是两个ts文件就可以播放,苹果IOS需要三个ts文件才可以播放),所有下载的临时文件最好是2和3的倍数,比如(6个ts文件,12个ts文件,18个ts文件)同时做切片,定义好分辨率,可以提高直播流的播放流畅性。

    这个就m3u8的播放列表文件

m3u8文件的播放列表 hls播放视频流的切片文件列表 实现这样的钉钉小程序视频列表

安卓一直是可以播放,ios无论如何都无法播放

经过多方面问题排查:

1、通过ffmeg拉流解析发现,video的profile为h264 high 4:2:2,而ios设备目前并不支持profile高于high级别高于4.1的视频的解码。

File format for the file segmenter can be a QuickTime movie, MPEG-4 video, or MP3 audio, using the specified encoding.

Stream format for the stream segmenter must be MPEG elementary audio and video streams, wrapped in an MPEG-2 transport stream, and using the following encoding. The Audio Technologies and Video Technologies list supported compression formats.

Encode video using H.264 compression

H.264 Baseline 3.0: All devices

H.264 Baseline 3.1: iPhone 3G and later, and iPod touch 2nd generation and later.

H.264 Main profile 3.1: iPad (all versions), Apple TV 2 and later, and iPhone 4 and later.

H.264 Main Profile 4.0: Apple TV 3 and later, iPad 2 and later, and iPhone 4S and later

H.264 High Profile 4.0: Apple TV 3 and later, iPad 2 and later, and iPhone 4S and later.

H.264 High Profile 4.1: iPad 2 and later and iPhone 4S and later.

A frame rate of 10 fps is recommended for video streams under 200 kbps. For video streams under 300 kbps, a frame rate of 12 to 15 fps is recommended. For all other streams, a frame rate of 29.97 is recommended.

Encode audio as either of the following:

HE-AAC or AAC-LC, stereo

MP3 (MPEG-1 Audio Layer 3), stereo

资料来源:iOS上hls无法播放问题 | 大专栏

2:经过一番排查,原因是出问题的摄像机,RTSP数据信息中没有音频参数,音频编码格式为0,通道数为0,而在转RTMP流推送时就使用了这种这些0去初始化了音频MetaData。但是实际直播时数据流是有音频流的。这样就存在初始参数与实际不符的情况,修改初始参数后问题就解决了。

资料来源:监控物联网直播时遇到iOS无法播放HLS流的问题解决_weixin_30596343的博客-CSDN博客_the media playback was aborted due to a corruption

资料来源:解决部分mp4视频在ios上无法播放问题 - 简书

资料来源:安放互联网直播HLS直播流在Android系统能播放但IOS系统无法直播问题解决 - EasyNVR - 博客园

资料来源:iOS 处理HLS视频流 - 兜兜有糖的博客 - 博客园

ios播放效果

最终解决问题:

web视频流播放没有问题,微信小程序视频流没问题,钉钉小程序播放视频流没问题,PC端视频流播放没问题,希望对大家有所帮助!

如果同样遇到相同问题,可以私信我,h5的资料也有的

发个红包鼓励下吧

相关文章

  • 钉钉小程序如何实现视频流播放-HSL&.m3u8

    目前视频直播微信小程序是支持的很好,钉钉小程序全网真的资源很少,官方文档也少的可怜,做个小程序真的是全网在找资源,...

  • 钉钉小程序 开发 PHP + 钉钉小程序 (企业内部应用)

    钉钉小程序 开发 PHP + 钉钉小程序 (企业内部应用) 应公司需求 需要结合钉钉开发小程序 由于公司自用 所以...

  • 钉钉小程序

    1. setData 改变对应的this.data的值 注意:不要直接修改this.data对应的数据。在dd.h...

  • 钉钉小程序

    微信小程序转钉钉小程序 css和html文件命名acss,axml 底部导航写法(app.json)items,n...

  • 微信小程序性能优化实践

    历史回顾: 微信小程序自定义组件 - 表格组件来啦 通过微信小程序来实现 “钉钉打卡” 记一次微信小程序项目分包,...

  • 钉钉小程序实现多张图片上传

    由于公司最近要通过钉钉审批连接后台系统,实现办公电子化,所以会出现这种需求 钉钉小程序提供的图片上传说明 封装后的...

  • 钉钉小程序填坑记

    第一章:什么是钉钉小程序 第一节:小程序简介 在钉钉内运行的"小程序"叫做E应用,后期小程序是来自于E应用的全新版...

  • 钉钉“小程序”,企业数字化办公新模式?

    据 36 氪消息,钉钉已于 6 月中旬上线企业级“小程序”。在钉钉开放平台的页面中,目前已上线“小程序 Easy ...

  • uni-app开发钉钉小程序

    最近接触到小程序开发,之前通过网课学过微信小程序的开发并实现过一个小的demo,但是这次的开发是钉钉小程序,而且考...

  • 钉钉小程序踩坑总结

    最近用uniapp写了一个钉钉小程序项目,由于刚兼容钉钉小程序不久,安卓和ios体验上差距还是蛮大的,包括本地测试...

网友评论

      本文标题:钉钉小程序如何实现视频流播放-HSL&.m3u8

      本文链接:https://www.haomeiwen.com/subject/caufrktx.html