前端播放m3u8格式视频
一、前端播放m3u8格式视频
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>前端播放m3u8格式视频</title>
<!--https://www.bootcdn.cn/video.js/-->
<link href="https://cdn.bootcss.com/video.js/7.6.5/alt/video-js-cdn.min.css" rel="stylesheet">
<script src="https://cdn.bootcss.com/video.js/6.6.2/video.js"></script>
<!--https://www.bootcdn.cn/videojs-contrib-hls/-->
<script src="https://cdn.bootcss.com/videojs-contrib-hls/5.15.0/videojs-contrib-hls.min.js"></script>
</head>
<body>
<video id="myVideo" class="video-js vjs-default-skin vjs-big-play-centered" controls preload="auto" width="" height="" data-setup='{}'>
<source id="source" src="http://ivi.bupt.edu.cn/hls/cctv1hd.m3u8" type="application/x-mpegURL">
</video>
</body>
<script>
// videojs 简单使用
var myVideo = videojs('myVideo',{
bigPlayButton : true,
textTrackDisplay : false,
posterImage: false,
errorDisplay : false,
})
myVideo.play() // 视频播放
myVideo.pause() // 视频暂停
</script>
</html>
二、ffmpeg之将rtsp流地址切片成为m3u8
windows 使用 ffmpeg 命令:
ffmpeg -i "rtsp://192.168.1.192:554/openUrl/FfAtLDq" -fflags flush_packets -max_delay -flags -global_header -hls_time -hls_list_size -vcodec copy -y D:\videos\video.m3u8
绿色是rtsp流地址
红色是切片后的文件的路径
linux使用的命令
ffmpeg -i "rtsp://184.72.239.149/vod/mp4://BigBuckBunny_175k.mov" -fflags flush_packets -max_delay -flags -global_header -hls_time -hls_list_size -vcodec copy -y /usr/local/nginx/html/second/video.m3u8
绿色是rtsp流地址
红色是切片后的文件的路径
代码实现(注意:因为代码制定ffmpeg.exe 命令里面不需要 ffmpeg -i rts... 直接 -i rtst... 即可)
class Program
{
static void Main(string[] args)
{
string para = " -i rtsp://113.136.42.45:554/PLTV/88888888/224/3221226087/10000100000000060000000001759104_0.smil -fflags flush_packets -max_delay 2 -flags -global_header -hls_time 2 -hls_list_size 3 -vcodec copy -y D:\\video.m3u8";
Process proc = new Process();
proc.StartInfo.FileName = @".\ffmpeg\ffmpeg.exe ";
proc.StartInfo.Arguments = para;
proc.StartInfo.UseShellExecute = false;
proc.StartInfo.CreateNoWindow = false;
proc.StartInfo.RedirectStandardOutput = true; //重定向输出
proc.StartInfo.WindowStyle = ProcessWindowStyle.Hidden; proc.Start();
Console.WriteLine(proc.Id);
proc.Dispose(); Console.ReadLine();
}
}
前端播放m3u8格式视频的更多相关文章
- 在vue项目中播放m3u8格式视频
前言:最近公司在做一个线上会议的项目,要求后台网站播放m3u8格式的视频,查找部分资料,总结一下,方便后边查阅 1.在vue工程中安装以下依赖: cnpm install video.js --sa ...
- html页面引用video.js播放m3u8格式视频
//head里面的内容,我是采用cdn引用的方式,因为项目太小 <head> <meta charset="utf-8" /> <title>二 ...
- Vue中如何插入m3u8格式视频,3分钟学会!
大家都知道video只支持ogg.webm.MP4格式,但是要是m3u8格式的视频怎么办?最近遇到这个问题在网上找了好多办法都不行,最后找到video.js后才完美解决,所以决定写一 ...
- Python 爬虫实例(13) 下载 m3u8 格式视频
Python requests 下载 m3u8 格式 视频 最近爬取一个视频网站,遇到 m3u8 格式的视频需要下载. 抓包分析,视频文件是多个 ts 文件,什么是 ts文件,请去百度 ...
- opencv实例三:播放AVI格式视频
一.不带滚动条的视频读取播放. 1.原理介绍:视频的本质是一些静态的图像的集合,opencv可以不断读取视屏中的图片,显示,就可以实时的视频流进行处理了. 2.代码如下: /************* ...
- Html 播放 mp4格式视频提示 没有发现支持的视频格式和mime类型
转自原文 Html 播放 mp4格式视频提示 没有发现支持的视频格式和mime类型 播放mp4格式的时候提示 Html 播放 mp4格式视频提示 没有发现支持的视频格式和mime类型 原因是在IIS中 ...
- vue中通过hls.js播放m3u8格式的视频
近期做了一个功能,是接入一个海康的摄像头的监控视频,怎么获取m3u8的视频这里就不在叙述了,只说一下怎么将m3u8格式的视频成功播放 一.m3u8和HLS介绍 1.M3U8文件是指UTF-8编码格式的 ...
- 流媒体测试笔记记录之————解决问题video.js 播放m3u8格式的文件,根据官方的文档添加videojs-contrib-hls也不行的原因解决了
详细代码Github:https://github.com/Tinywan/PHPSharedLibrary/tree/master/Tpl/Html5/VideoJS 想播放hls协议的就是m3u8 ...
- 百度播放器SDK 播放MP4格式视频有声音无画面问题解决
此处为记录解决过程. 所链接使用的MP4格式视频为codec id是mp4v-20.使用手机自带播放器可以播放,使用百度云媒体播放器不能无画面.经调试,Android Baidu-Cloud-Play ...
随机推荐
- sqli-labs(11)
基于登录点的注入(小编这里傻逼了 可以直接用group_concat函数绕过显示问题我还在用limit绕过) 0X01这里我们的参数就不是在get的方法里面提交的了 我们遇到了全新的问题 那么该怎么 ...
- [CSP-S模拟测试]:新的世界(BFS)
题目背景 小学五六年级的乔猫是一个喜欢不务正业写游戏的孩纸$......$他曾经模仿著名的沙盒游戏<$Minecraft$>做过一个自己的游戏$"NEWorld"$.这 ...
- FineReport打印方式(转)
1. 报表打印机制 各种打印的运行机制,都是选择打印时,先根据报表内容,在服务器的内存中将页面中的内容全部生成完毕,即生成对应格式的对象:然后再由serverlet直接推送给客户端,最后根据选择的打印 ...
- Flask基础总结
Flask 基础总结 .Flask优点: 拥有强大的第三方组件小而精非常全面,不足就是更新太快 .Flask中的三剑客: HTTPRespone redierct render_template .F ...
- Delphi XE2 之 FireMonkey 入门(36) - 控件基础: TForm
Delphi XE2 之 FireMonkey 入门(36) - 控件基础: TForm 当我第一次读取 Form1.StyleLookup 并期待出现 "formstyle" 时 ...
- Jmeter之保存响应到文件
在jmeter中使用保存响应到文件 ------适用于非GUI模式执行脚本时,无法查看报错的信息. 1.添加组件: 2.各个配置项说明: (1.名称:即组件在整个测试计划中的名称显示,建议设置为用意义 ...
- MySQL5.6版本之后设置DATETIME类型自动更新
在使用MySQL中datetime格式自动更新特性时,我们应该明确一点,datetime格式设置默认值为当前时间和自动更新时间是从MySQL5.6版本之后开始支持的.此前我们都是使用timestamp ...
- 别把&和nohup混为一谈, 根本不是同一个东西好不好 ------ 聊聊./a.out & , nohut ./a.out , nohup ./a.out &的区别
在第一家公司工作的时候, 我认识了&,在第二家公司工作的时候, 我认识了nohup, 这就是渊源. 随后, 我就一直糊涂用他们, 但并不懂这两个东西. 网上很多地方是乱扯, 瞎复制, 为什 ...
- debian下安装mysql 5.1.34
#cd /usr/local/src # tar xvzf mysql-5.1.34.tar.gz # cd mysql-5.5.1.34 配置和编译 #chmod +x configure # ./ ...
- 简述在Vue脚手架中,组件以及父子组件(非父子组件)之间的传值
1.组件的定义 组成: template:包裹HTML模板片段(反映了数据与最终呈现给用户视图之间的映射关系) 只支持单个template标签: 支持lang配置多种模板语法: script:配置Vu ...