当前位置: 首页 > news >正文

网站搜索功能怎么实现如何建议一个网站

网站搜索功能怎么实现,如何建议一个网站,线上商城推广,天津网站定制将MP4文件直接放在nginx的目录下,也可以用浏览器打开,但是可能直接下载,而不是播放,video.js直接播放MP4文件,对MP4文件格式有要求,一方面必须是H264编码,否则可能没声音,二是要播放…

将MP4文件直接放在nginx的目录下,也可以用浏览器打开,但是可能直接下载,而不是播放,video.js直接播放MP4文件,对MP4文件格式有要求,一方面必须是H264编码,否则可能没声音,二是要播放器要先下载moov才能开始播放,而录像设备生成的MP4一般moov在mdat之后,这样要等待很长时间,所以需要用ffmpeg等工具将moov移动到最前面。

目前使用的方案是,先用ffmpeg将MP4转为hls,生成m3u8和ts切片文件,再由nginx发布,在浏览器中用video.js播放。

1 nginx配置

只需在nginx的配置文件中http部分增加设置即可,

http {……server {listen       80;server_name  192.168.3.136;……location /hls {types {application/vnd.apple.mpegurl m3u8;video/mp2t ts;}# 指定 HLS 视频文件的根目录alias /opt/video/hls/;# 不缓存add_header Cache-Control no-cache;# 允许跨域请求,如果你的客户端在另一个域上运行的话add_header 'Access-Control-Allow-Origin' '*';add_header 'Access-Control-Allow-Credentials' 'true';}……}……
} 

特别注意这里的视频文件目录设置,使用alias时,后面的目录就是视频文件的实际存放路径,且后面必须有”/“,有些资料里将alias换成root,这时后面的路径假设是path1,那么实际视频存放的路径应该是path1/hls,这个hls是location的名字。

2 m3u8文件的生成

如果有ffmpeg,可以用以下命令将MP4文件转换为m3u8:

ffmpeg -i test.mp4 -codec: copy -bsf:v h264_mp4toannexb -map 0 -f segment -segment_list test.m3u8 -segment_time 10 test%03d.ts-i test.mp4指定输入文件。
  • -codec: copy表示不对视频进行重新编码,只是复制原始数据。

  • -bsf:v h264_mp4toannexb是一个比特流过滤器,用于将H264视频从MP4格式转换为MPEG2 TS格式,这是必需的,因为M3U8是基于TS的。

  • -map 0表示选择所有的流(例如,如果你的视频有音频和字幕)。

  • -f segment表示输出应该被分割成多个文件。

  • -segment_list test.m3u8指定输出的播放列表文件。

  • -segment_time 10表示每个TS段的最大长度(以秒为单位)。

  • test%03d.ts是输出TS文件的名称模式。%03d将被替换为三位数的序号。

3 视频播放

按照上面的配置,视频的访问地址是http://you_host_name/hls/test.m3u8,其中you_host_name是nginx中http server server_name项的主机地址,hls是在location项的地址,test.m3u8是生成的视频文件名。

建议使用视频播放器,或者在浏览器中嵌入视频播放插件来播放,在浏览器中直接输入以上地址,可能会导致直接下载而不是播放视频。

可以使用video.js实现视频播放,对于hls流,还需要增加videojs-contrib-hls插件,完整实例代码如下

<html>
<head><link href="https://vjs.zencdn.net/8.23.3/video-js.css" rel="stylesheet" /><!-- If you'd like to support IE8 (for Video.js versions prior to v7) --><!-- <script src="https://vjs.zencdn.net/ie8/1.1.2/videojs-ie8.min.js"></script> -->
</head><body><video id="myVideoPlayer" class="video-js vjs-default-skin" data-setup="{'fluid': true}" controls><source src="http://192.168.3.136/hls/test.m3u8" type="application/x-mpegURL">Your browser does not support HTML5 video.</video>
<script src="https://vjs.zencdn.net/8.23.3/video.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/video.js-contrib-hls@latest/dist/videojs-contrib-hls.min.js"></script>
<script type="text/javascript">var player = videojs('myVideoPlayer');player.hls({overrideNative: true, // 强制使用 HLS,如果可用的话highWaterMark: 524288 // 设置媒体源扩展的 buffer 大小(以字节为单位)});
</script></body>
</html>
http://www.dtcms.com/a/428275.html

相关文章:

  • [工作流节点4] 分支节点与条件判断 —— 明道云工作流核心逻辑拆分技巧
  • numpy -- 字符串函数 capitalize() 和 title() 简介
  • Aupload + vuedraggable实现 上传的文件可以拖拽排序
  • 邯郸做网站的公司哪家好国家备案网
  • 人工智能与小程序开发:双翼齐飞,重塑数字体验新范式
  • eNSP、HCIA学习笔记
  • 网上书城 网站建设方案高端网站服务范围
  • Geant4实例
  • 网站建设一条龙全包seowordpress动态计时
  • 【Battery】慢速和快速充电的显示逻辑
  • 一个startActivity请求是如何穿越进程边界
  • 怎么看一个网站是用什么程序做的衡水建设网站
  • 网站建设配图微商城网站建设信息
  • 富文本【表格】
  • 【Java数据结构】——堆(找出用于解决最大/最小的n个元素,或者求中位数)
  • Python快速入门专业版(五十一):Python异常处理进阶:try-except-finally与raise语句(资源释放与主动抛异常)
  • 买家秀接口深度开发:从内容解析到情感分析的全链路实现
  • 密钥管理系统KSP在智能水表行业的应用
  • 中国建设银行网站多少汕头网站建设过程
  • 基于STM32与influxDB的电力监控系统-6
  • 【教程】nvidia-smi dmon获取GPU相关的完整信息
  • wordpress 网站上传制作网站的公司叫什么
  • 服装网站建设运营规划扬州网站建设推广
  • 网站后台管理怎么进asp网站服务建设
  • 公司建网站多少钱一个免费网页代理在线
  • 大连网站建设 青鸟传媒百度云平台建设网站
  • 豆各庄做网站的公司网站版块设计是什么意思
  • 代发新闻稿的网站四大软件外包公司
  • 信用体系建设网站维运工作制度任丘建设网站制作
  • JavaBean参数校验