首页 > 其他分享 >从DPlayer说起,有哪些开源的H5播放器

从DPlayer说起,有哪些开源的H5播放器

时间:2023-11-14 14:12:21浏览次数:127  
标签:播放器 www DPlayer H5 文档 https com

引言

​ H5指的是HTML5,也就是介绍网页播放器(只是列出而已)。首先我不是什么大佬,并没有完全体验过以下我会介绍的全部播放器;其次,因为我水平比较低,主要介绍拥有中文文档的播放器,不了解开发的朋友当成科普看看就行,平常用不到,了解的可以补充一下还有哪些,毕竟我收集的肯定不全,最好能补充中文文档的。

正文

中文文档

DPlayer

https://dplayer.diygod.dev/zh/guide.html#special-thanks

最热门的播放器,至少在我心里是。有不少网站以及播放器都是基于这个做修改。

image

Mui player

https://www.ckplayer.com/

ckplayer

https://www.ckplayer.com/

也算是蛮热门的,以前经常看到,只不过现在临时找不出来。

官网示例视频用的黑神话悟空PV

xgplayer西瓜播放器

http://h5player.bytedance.com/

字节跳动的,西瓜视频和抖音就是用这个

griffith知乎播放器

https://github.com/zhihu/griffith/blob/master/README-zh-Hans.md

看了一眼是React,H5看上去也是能用的。

artplayer

https://www.artplayer.org/

挺冷门的,这个不是我搜出来的而是我用的一个网站使用了这个播放器。

Sewise Player

https://github.com/jackzhang1204/sewise-player

冷门且不更新了,看看就行了

无中文文档

也有可能是没找到中文文档。这里面会略过一些,英文看着还是不方便。

video.js

https://docs.videojs.com/

ExoPlayer,谷歌出品

https://github.com/google/ExoPlayer

MediaElement.js

https://www.mediaelementjs.com/

plyr,蛮好看的

https://plyr.io/

额外补充

这个播放器样式不错,我查了一下似乎是阿里的播放器,似乎不开源,还是算了

prism-player,百度一查是AliPlayer,看了一下类名是一致的

其实播放器样式只是加分项,最重要的还是视频的加载速度,搞好cdn

结语

​ 播放器的样式确实能给人耳目一新的感觉,不少用心的网站是自己定制播放器的(即使是基于开源项目做修改)。但是外观不是全部,比外观更重要的是内容。

​ 祝各位生活愉快。

标签:播放器,www,DPlayer,H5,文档,https,com
From: https://www.cnblogs.com/oldsaltfish/p/17831467.html

相关文章

  • H5跳转小程序
    Vue3+vitemain.js文件app.config.compilerOptions.isCustomElement=(tag)=>tag.startsWith('wx-open-launch-weapp');//防止vue变异报错Page.vue<wx-open-launch-weappid="launch-btn":username="要跳转的小程序原始id":path=......
  • 视频监控EasyCVR平台播放告警录像时,播放器显示不全是什么原因?
    防视频监控/视频集中存储/云存储/磁盘阵列EasyCVR平台可拓展性强、视频能力灵活、部署轻快,可支持的主流标准协议有国标GB28181、RTSP/Onvif、RTMP等,以及支持厂家私有协议与SDK接入,包括海康Ehome、海大宇等设备的SDK等。平台既具备传统安防视频监控的能力,也具备接入AI智能分析的能力......
  • H5网页跳转微信小程序踩坑
    问题:苹果手机可以显示图片跳转按钮,但是安卓手机无法显示出来。、问题:苹果手机可以显示图片跳转按钮,但是安卓手机无法显示出来。、原因:看看图片链接是 // 还是 http 开头,如果是 //test.com/upload/60/2b605429ddcc756370be777761c98d.png 这种形式的图片链接,会导致安卓手机......
  • 视频监控系统EasyCVR平台播放告警录像时,播放器显示不全是什么原因?
    安防视频监控/视频集中存储/云存储/磁盘阵列EasyCVR平台可拓展性强、视频能力灵活、部署轻快,可支持的主流标准协议有国标GB28181、RTSP/Onvif、RTMP等,以及支持厂家私有协议与SDK接入,包括海康Ehome、海大宇等设备的SDK等。平台既具备传统安防视频监控的能力,也具备接入AI智能分析的......
  • Vue3(开发h5适配)
    在开发移动端的时候需要适配各种机型,有大的,有小的,我们需要一套代码,在不同的分辨率适应各种机型。因此我们需要设置meta标签<metaname="viewport"content="width=device-width,initial-scale=1.0">移动设备具有各种不同的屏幕尺寸和分辨率,例如智能手机和平板电脑。为了提供更好的......
  • H5封装和原生开发有什么差别
    原生开发和H5封装App是两种不同的应用开发方式,各有各的优缺点,在选择开发方式时,应考虑自身需求的来选择。我们该如何分别App是使用的哪种开发方式。这两者又有什么区别呢?原生开发是指为特定操作系统(如iOS或Android)开发应用程序。整个应用程序代码,逻辑和界面都是按照该系统提供的规......
  • 评估APP网页小程序代码UI开发H5估价师怎么评估精确研发价格?
    大家好,我是咕噜签名分发可爱多。今天跟大家分享点不一样的。作为一名应用程序开发评估师,可能涉及到的主要任务是为特定的应用程序提供估算开发成本和所需时间预测。为了为一个应用程序更准确地评估价格。整理了以下方面。1、如何让一个App更好、更精确地评估出价格?以下是一个可能的......
  • h5购物车列表实现商品左滑删除
    <htmllang="en"><head><metacharSet="UTF-8"><title>Title</title><style>.cart-list{padding:4px;}.cart-item{position:relative;......
  • iframe预览pdf在H5页面上变成了下载操作
    上图展示了问题,那么怎么解决问题。因为我开发是在内网,安装依赖包对我来说很费劲。所以我选择了pdfh5的快速使用,教程可以看这个链接 https://gitee.com/gjTool/pdfh5,我选择的是第一种方式,请看下图 下面是我运行成功的代码截图 ①在static里面放入下载的文件,并在index.htm......
  • 038-第三代软件开发-简易视频播放器-自定义Slider (二)
    第三代软件开发-简易视频播放器-自定义Slider(二)文章目录第三代软件开发-简易视频播放器-自定义Slider(二)项目介绍简易视频播放器自定义Slider(二)横向纵向关键字:Qt、Qml、关键字3、关键字4、关键字5项目介绍欢迎来到我们的QML&C++项目!这个项目结合了QML(QtMeta-......