播放器开发专栏
音频播放器、视频播放器、RTMP流媒体播放器、HTML5视频播放器开发方向技术文章专栏
阿酷tony
这个作者很懒,什么都没留下…
展开
-
批量视频如何做成一个二维码(分步骤教程)
1. 一批视频需要按组分类,生成一个二维码,实现扫一个二维码,观看一批内容;2. 100个视频放在一个二维码,实现扫码观看这100个视频的内容。3. 适合教学类课程内容,一批产品的视频展示内容等等。原创 2024-09-11 10:00:11 · 776 阅读 · 0 评论 -
html5的video播放器标签音量大小、快进、播放等控制
html5的video播放器标签音量大小、快进、播放等控制,Video标签的属性,方法和事件汇总原创 2024-08-14 09:02:55 · 250 阅读 · 0 评论 -
Html5播放器如何实现倍速播放
设置为false则关闭倍速,可传入数组自定义显示哪几种倍速,速率1不需要填入,会自动添加,所设置速率值必须大于0,少于或等于3,最多设置6种速率(不包含1),所设置值会按由大到小自动排序原创 2022-11-03 11:26:10 · 4851 阅读 · 0 评论 -
vue引入video视频播放器(视频调用代码范例)
vue视频调用代码范例,vue视频调用代码范例,vue视频调用代码范例原创 2022-08-23 16:36:52 · 2663 阅读 · 0 评论 -
最全的视频格式分类详解(很全面)
常见在线流媒体格式:mp4、flv、f4v、webm移动设备格式:m4v、mov、3gp、3g2RealPlayer :rm、rmvb微软格式 :wmv、avi、asfMPEG 视频 :mpg、mpeg、mpe、tsDV格式 :div、dv、divx其他格式 :vob、dat、mkv、lavf、cpk、dirac、ram、qt、fli、flc、mod2020-11-12补充:●AVI格式它的英文全称为Audio Video Interleaved,即音频视...原创 2021-07-12 11:42:42 · 31196 阅读 · 1 评论 -
blob写法的浏览器兼容性
blob写法的浏览器兼容性:我的视频应用类原创文章酷播云免费视频二维码的完整使用教程(适合小企业做微信视频宣传) 视频二维码的适用场景 微信公众号直播有哪些不一样的玩法? 微信视频直播如何做收费直播(如何做付费的微信直播)图文教程 说说视频编码格式、视频码率、视频帧率、分辨率的概念 原创教程:带ppt课件和讲师画面的教学视频录制完整教程 如何做电视节目的视频直播(电视台节目直播) 做视频直播时如何测试本地网络的上行带宽(网速测试) usb摄像头做教学直播实现pc和手机都可以..原创 2021-07-12 08:45:40 · 1310 阅读 · 0 评论 -
blob用法实例:http地址的原理及生成方法
服务端 index.php<?php// 返回二进制流数据$file_path = __DIR__ . '/video.mp4';$file_size = filesize($file_path);$oct_data = fread(fopen($file_path, "r"), $filesize);header("Content-type: video/mpeg4;charset=UTF-8");header("Content-Length: " . $filesiz...原创 2021-07-09 09:08:08 · 2215 阅读 · 0 评论 -
Html5视频video标签中使用blob实现视频播放加密
后端代码:/* * 在这里可以进行权限验证等操作 */ //创建文件对象File f = new File("E:\\test.mp4");//获取文件名称String fileName = f.getName();//导出文件String agent = getRequest().getHeader("User-Agent").toUpperCase();InputStream fis = null;OutputStream os = null;try { ...原创 2021-07-09 08:59:23 · 6485 阅读 · 0 评论 -
视频试看(视频预览观看)一小部分的实例
预播放一段时间的视频内容,引导用户付费观看完整视频,达到转化用户的目的。预览代码,适用于flash及移动端播放场景(默认3分钟)<script src='//player.polyv.net/script/polyvplayer.min.js'></script><div id='previewArea'></div><script>var player = polyvObject('#previewArea').previewPl原创 2021-07-08 14:44:38 · 9701 阅读 · 0 评论 -
html5播放器JS交互(示例)
X5内核是腾讯基于优秀开源Webkit深度“优化并加工”的浏览器渲染引擎 微信和手机qq都是 还有一些就不细说了x5内核会监管video标签播放的视频 无论是暂停或结束都会推送一些广告 且是最高级所以 通过JS或Video标签控制播放暂停 没啥用 网上找了 看了 也试了 几种方式一 自动循环播放 手动关 看不见等于没有(微信和许多浏览器都不让自动播放 须先触发事件 即便循环几遍 也会强制结束 依旧弹广告 放弃吧 没用的)二 js监视视频播放结束后,先执...原创 2021-07-08 14:38:50 · 587 阅读 · 2 评论 -
h5播放器playbackRate设置当前播放速度实现倍速播放
定义和用法playbackRate 属性设置或返回音频的当前播放速度。浏览器支持所有主流浏览器都支持 playbackRate 属性。注意:Internet Explorer 9及更早IE版本不支持 playbackRate 属性。语法如下:// 视频获取速率var videoSpeed = video.playbackRate;// 视频设置播放速率,如正常速度播放video.playbackRate = 1.0;// 获取音频播放速率var audioSpee..原创 2021-03-24 10:27:32 · 7675 阅读 · 0 评论 -
html5播放器视频倍速播放功能
阿酷TONY 2021-3-241. 倍速播放功能可以让视频加速或者减速播放;2. 在PC端,HTML5播放器能轻松实现倍速播放功能,您可以将视频的播放速度设定为0.5倍,1倍(正常速),1.2倍,1.5倍,2倍。移动端要使用倍速功能,则是通过集成SDK来实现;3. H5播放器的使用方法有两种,第一种,是直接通过一段JS代码实现;第二种是通过在点播后台,视频设置里直接勾选优先使用H5播放器,然后使用多终端代码;4. 目前H5播放器需要IE11或以上的浏览器才能完美兼容。截图效果:.原创 2021-03-24 10:10:07 · 3677 阅读 · 3 评论 -
视频播放过程中做视频问答(视频弹题功能)
视频问答(视频弹题功能)视频播放到某个时间点,弹出问题卡,学员只有正确回答课件视频中弹出的问题之后才能继续观看视频。通过互动问答的方式,不仅有利于巩固前边学习的知识点,评估学员的学习效果,也有效避免学员挂机的现象。问答播放器还能起到一定的防录屏作用,大大降低盗版视频的观看体验。STEP1登录酷播云管理平台,选择“视频列表”,点选对应视频,之后从右侧功能区选择“添加问答/听力”,即会弹出如下设置窗口,进行相关问题的设定。图1:视频问答功能(操作方法)图2:视频问答功能.原创 2021-03-08 23:03:16 · 8301 阅读 · 11 评论 -
如何检查电脑是否已经安装Flash Player
某些情况下,部分用户不知道自己的电脑是否已经安装 Flash Player。我们根据系统的不同,提供了不同系统如何检查是否已安装 Flash Player的方法:第1部分:Windows 7/8/10系统教程 第2部分:Windows XP系统教程第1部分:Windows 7/8/10系统(以win7系统为例)1 . 在菜单栏输入控制面板,点击控制面板2 . 单击程序和功能3 . 查看是否有Adobe Flash Player第2部分:Windows XP系...原创 2020-11-18 09:06:40 · 4887 阅读 · 0 评论 -
视频二维码功能应用与教程(完整版)
视频二维码功能应用与教程(完整版)基于第三方视频云平台,实现效果是列表播放,可以嵌入自己网站。这就是视频列表二维码,一个二维码搞定视频列表播放。视频列表二维码是指用户上传视频多个视频后,通过酷播云的视频专辑功能,自动生成列表二维码,实现视频列表播放的功能。观看者通过扫该二维码直接观看视频列表,还可以非常方便的嵌入公众号自定义菜单,效果超级棒。上效果:创建视频列表专辑进入酷播云管理平台,打开“视频列表”,点击"视频专辑"功能,创建“新增专辑”,如下图。图3-1:..原创 2020-08-24 11:57:21 · 2737 阅读 · 0 评论 -
视频中常用的HLS(m3u8)协议分析
视频中常用的HLS(m3u8)协议分析HLS 全称是 HTTP Live Streaming,是 Apple 提出的流媒体协议,苹果官方的介绍是这样的子的:HTTP Live StreamingSend live and on‐demand audio and video to iPhone, iPad, Mac, Apple TV, and PC with HTTP Live Str...原创 2018-12-11 09:23:32 · 6492 阅读 · 0 评论 -
判断用户端有无安装flash插件并返回对应播放器选项提示
判断用户端有无安装flash插件并返回对应播放器选项提示<!doctype html><html><head><meta charset="utf-8"><title>demo</title></head><body><div cla原创 2018-11-29 10:23:40 · 265 阅读 · 0 评论 -
HTML5视频播放器自定义样式控制播放代码示例
HTML5视频播放器自定义样式控制播放代码示例<div id="video_div" style="text-align:center;"> <button onclick="playPause()">播放/暂停</button> <button onclick="toBig()">大</b转载 2018-11-22 10:22:28 · 4107 阅读 · 0 评论 -
解决微信中视频层级播放问题(附代码)
2018-11-20 长沙 雨一直下气氛不算融洽/好冷关键:x5-video-player-type="h5"//微信解决视频层级播放问题<div class="myvideo><video id="video" class="video" controls="controls" playsinline x5-video-player-type="原创 2018-11-20 12:15:13 · 4215 阅读 · 0 评论 -
HLS播放:html5下用video标签来播放m3u8格式的视频
HLS播放:html5下用video标签来播放m3u8格式的视频<video class="tvhou" width="100%" height="100%" controls="controls" autoplay="autoplay" x-webkit-airplay="true" x5-video-player-fullscreen="原创 2018-11-20 10:58:10 · 30772 阅读 · 1 评论 -
视频播放常见问题让IIS支持mp4、flv等mime类型的设置
视频播放常见问题让IIS支持mp4、flv等mime类型的设置 操作:在服务器IIS ( Internet 信息服务(IIS)管理器 ) 中打开该站点1.点击“MIME类型”;2.点击“添加”MIME类型;MP4格式添加:文件扩展名:.mp4 (注意前面有个".")MIME类型:video/mp4FLV格式添加:文件扩展名:.flv(注意前面有个".")M...原创 2018-11-15 09:07:06 · 4113 阅读 · 0 评论 -
自己动手实现html5视频播放器倍数播放功能
自己动手实现html5视频播放器倍数播放功能<!DOCTYPE html><html><head><meta charset="utf-8"><title>阿酷TONY--Tangni</title></head><body><div s原创 2018-11-08 18:42:41 · 10623 阅读 · 0 评论 -
HTML5倍数功能视频播放器(加速2倍,1.5倍播放)
本文章为原创文章,因为有很多朋友加我QQ咨询播放器来源的事,我在这补充说明一下:方式一中,播放器的倍速播放效果截图,来自酷播云免费视频平台,播放器自带这个功能有兴趣的朋友,可以注册用一下就知道 http://www.cuplayer.com/cloud ,主要为中小企业提供免费视频云服务;实例的演示效果,可以参见 http://www.52player.cn/Demos/CloudPlay...原创 2018-11-07 16:55:09 · 63626 阅读 · 4 评论 -
html5视频全屏背景插件(支持全屏背景,标签实现)
vidbacking是一款响应式的,跨平台的html5视频背景插件。该视频背景插件允许你在页面中的某个div后整个页面中使用HTML5视频作为背景。使用简单,对于在元素内制作视频背景效果,你只需要将video标签放在元素内即可。 Vidbacking Demo of Ba转载 2018-01-23 15:15:34 · 4233 阅读 · 1 评论 -
jQuery+html5音乐网站mp3播放器代码
播放器演示jQuery+html5音乐网站mp3播放器代码演示播放器介绍jQuery+html5音乐网站mp3播放器代码1. 支持显示播放进度条;2. 支持拖动播放功能;3. 支持显示音量调节;4. 支持添加分享、收藏功能,比较适合网站使用。5. 适用浏览器:360、FireFox、Chrome、Opera、傲游、搜狗、世界之窗. 不支持Safari、IE8及以下浏览器。下载:http://www转载 2018-01-19 17:27:10 · 2573 阅读 · 0 评论 -
为什么有些mp4不能在html5中video标签播放
首先我自己从网上下载的一个MP4文件,IE10和谷歌都能正常播放。然后自己用格式化工厂转换了一个RMVB文件为MP4,然后就不能播放。如下图,我选择MP4格式转换,里面的配置文件也调了很多遍,但是就是播放不了,IE10完全没反应,谷歌倒是能出声音,但是影像出不来。转载 2017-10-31 11:31:08 · 2603 阅读 · 1 评论 -
html5视频标签播放视频时的事件问题
今天遇到了难题,就是关于视频事件的问题,最终查了一下,解决了。备用说明如下原创 2017-10-26 23:35:54 · 1891 阅读 · 0 评论 -
酷播v4.0免费播放器最新最简短代码范例
酷播v4.0免费播放器最新最简短代码范例,增加微信中的logo显示 ( iOS下支持);4. 配合css样式,可以分别设定PC端和移动端不同尺寸宽高的播放器;原创 2017-10-20 17:31:47 · 3310 阅读 · 0 评论 -
酷播更新了html5和flash播放器的优先级选项和收费预览视频功能
酷播更新了html5和flash播放器的优先级选项和收费预览视频功能。1. 增加播放器优先级选项;2. 增加支持PC端和移动端的视频预览功能(收费预览视频功能);3. 增加微信中的logo显示 ( iOS下支持);原创 2017-10-10 17:23:05 · 1183 阅读 · 0 评论 -
视频节目预览功能播放器下载(视频收费模式、支持电脑端与微信视频预览功能)
1. 实现让用户预览一小段视频节目;2. 设定一个预览时间,比如15秒,播放完15秒后,弹出对话框,提示用户须注册(或须付费购买);3. 弹出的对话框内容由div+css内容设定,可自由设定弹出框的内容,比较方便使用;4. 播放器接收设定的结束时间值后,停止播放视频,执行结束函数从而弹出结束的提示对话框;5. 本范例是支持电脑端观看,也支持手机端、平板、微信端观看,适配性强。原创 2017-10-13 13:55:20 · 1749 阅读 · 0 评论 -
js判断终端(精简版示例)
js判断终端(精简版示例):<script type="text/javascript">if(window.location.toString().indexOf('pref=padindex') != -1){}else{if(/AppleWebKit.*Mobile/i.test(navigator.userAgent) || (/MIDP|SymbianOS|NOKIA...原创 2019-09-23 09:22:05 · 428 阅读 · 0 评论 -
https与http协议调用文件的问题处理
相对协议应用场景浏览器默认是不允许在 https 里面引用 http 资源的,一般都会弹出提示框。用户确认后才会继续加载,用户体验非常差。而且如果在一个 https 页面里动态的引入 http 资源,比如引入一个 js 文件,会被直接 block 掉的。Chrome v21 之后,在 SSL 加密页面 embed 非 SSL 的 Flash 资源也会被默默的屏蔽掉,只留下一句 ...原创 2019-10-10 09:38:17 · 1116 阅读 · 0 评论