首页 > 其他分享 >spring boot视频播放平台,播放视频很卡,有几种方案解决

spring boot视频播放平台,播放视频很卡,有几种方案解决

时间:2023-10-11 15:24:54浏览次数:33  
标签:视频 很卡 浏览器 String param 播放 response

1.首先

介绍场景:视频播放平台,系统使用 Springboot 和 Vue 编写。拥有前台和后台,前台进行视频播放,后台进行视频的上传,也可以上传音乐和图片,功能顺手都做了。

2.问题:

浏览器播放视频卡顿。视频卡顿问题需要攻克 2 关。

3.解决过程

1 )第一关:视频文件太大,浏览器加载时间长。采用后端对文件分块读取。

- 场景:编写完成文件的上传与下载接口,在浏览器使用<video>组件绑定 url 进行观看视频。按照以上步骤,浏览器是能正常播放视频的,但是我把项目发布到服务器后,就出现另一个情况了。我发现浏览器会一直加载视频,浏览器中心呈现转圈动画,进度条会一点一点增长,但是没有画面出现。直到进度条加载完,才会出现画面。
- 原因:后端的下载接口是把整个视频文件一下子发送到浏览器,所以浏览器一直在接收文件,接收完文件后,浏览器的 video 组件才能进行播放。
- 解决:后端接口使用 randomAccessFile 类读取文件,这个类取到 file 的信息后,你便可以设置从文件的哪个位置开始读取,读取多少字节,然后把数据响应到浏览器。 这样就解决了浏览器一直加载视频的问题。例子代码在末尾。


2)第二关:服务器带宽太低,视频下载赶不上视频播放,造成视频播放卡顿。采用 ffmpeg 组件进行画质压缩。
- 场景:假如有一个 30 秒 90M 的视频(我手机录的),上传到服务器了,然后在浏览器进行播放,那么播放视频就会卡顿了。
- 原因:因为服务器的带宽是 1M/s ,每秒能传送 1M 文件到浏览器,但是浏览器要想流畅播放那个视频,浏览器需要每秒接收 3M文件,90M 的视频,30 秒,每秒需要播放 3M ,所以这就造成视频播放卡顿了。
- 解决:使用 ffmepg 组件,把 90M的视频压缩到 30M ,可以压缩视频的比率和分辨率,最好进行相同比例的压缩,不然画质会变糊。

代码:
1 )第一关:

/**
* 分块读取
* @param request
* @param response
* @throws IOException
*/
public void BlockReading(HttpServletRequest request, HttpServletResponse response) throws IOException{
response.reset();
File file = new File("路径");
long fileLength = file.length();
// 随机读文件
RandomAccessFile randomAccessFile = new RandomAccessFile(file, "r");
//获取从那个字节开始读取文件
String rangeString = request.getHeader("Range");
long range=0;
if (StrUtil.isNotBlank(rangeString)) {
range = Long.valueOf(rangeString.substring(rangeString.indexOf("=") + 1, rangeString.indexOf("-")));
}
//获取响应的输出流
OutputStream outputStream = response.getOutputStream();
//设置内容类型
response.setHeader("Content-Type", "video/mp4");
//返回码需要为206,代表只处理了部分请求,响应了部分数据
response.setStatus(HttpServletResponse.SC_PARTIAL_CONTENT);
// 移动访问指针到指定位置
randomAccessFile.seek(range);
// 每次请求只返回1MB的视频流
byte[] bytes = new byte[1024 * 1024];
int len = randomAccessFile.read(bytes);
//设置此次相应返回的数据长度
response.setContentLength(len);
//设置此次相应返回的数据范围
response.setHeader("Content-Range", "bytes "+range+"-"+(fileLength-1)+"/"+fileLength);
// 将这1MB的视频流响应给客户端
outputStream.write(bytes, 0, len);
outputStream.close();
randomAccessFile.close();
System.out.println("返回数据区间:【"+range+"-"+(range+len)+"】");
}

2 )第二关:

ffmepg 依赖

<dependency>
<groupId>org.bytedeco</groupId>
<artifactId>javacv-platform</artifactId>
<version>1.5.3</version>
</dependency>


public class VideoCompression{
/**
* 修改视频分辨率
* @param imagePath 原视频地址
* @param outputDir 输出目录
* @param width 宽度
* @param height 高度
* @param bitRate 码率
* @return 视频地址
* @throws Exception 异常
*/
public static String videoCompression(
String imagePath, String outputDir, Integer width, Integer height, Integer bitRate)
throws Exception {
if (bitRate == null) {
bitRate = 2000;
}
List<String> paths = Splitter.on(".").splitToList(imagePath);
String ext = paths.get(paths.size() - 1);
if (!Arrays.asList("mp4").contains(ext)) {
throw new Exception("format error");
}
String resultPath =
Joiner.on(File.separator).join(Arrays.asList(outputDir, IdUtil.simpleUUID() + "." + ext));
String ffmpeg = Loader.load(org.bytedeco.ffmpeg.ffmpeg.class);
ProcessBuilder builder =
new ProcessBuilder(ffmpeg,"-i",imagePath, "-s",
MessageFormat.format("{0}*{1}", String.valueOf(width), String.valueOf(height)),
"-b",MessageFormat.format("{0}k", String.valueOf(bitRate)),resultPath);
builder.inheritIO().start().waitFor();
return resultPath;
}
}

 

标签:视频,很卡,浏览器,String,param,播放,response
From: https://www.cnblogs.com/kuao/p/17757260.html

相关文章

  • 为什么不能单纯地从前端来解决跨域问题?LiteNVR安防视频系统为何需要跨域?
    视频监控系统涉及到从前端实时图像信息的采集、信息的传输交换、实时监控到信息的数字化、相关的联动应用和庞大的信息管理等多项环节,包括对各前端视频信息的采集、传输、监控、存储、处理、发布、回放、流转、备份等管理。在安防监控系统LiteNVR运维过程中,我们有时会遇到关于跨......
  • 智能视频分析系统AI智能分析网关V3触发告警图片不显示该如何解决?
    AI智能分析网关V3包含有20多种算法,包括人脸、人体、车辆、车牌、行为分析、烟火、入侵、聚集、安全帽、反光衣等等,可应用在安全生产、通用园区、智慧食安、智慧城管、智慧煤矿等场景中。将网关硬件结合我们的视频监控系统EasyCVR一起使用,可以实现多现场的前端摄像头等设备统一集中......
  • Lnton羚通视频分析算法平台保障工人安全智慧工地安全帽解决方案
    Lnton羚通的算法算力云平台是一款出色的解决方案,具备突出的特点。该平台提供高性能、高可靠性、高可扩展性和低成本的功能,使用户能够高效地执行各种复杂的计算任务。此外,平台还提供了丰富的算法库和工具,支持用户上传和部署自定义算法,提高了平台的灵活性和个性化能力。在工地现场,由......
  • 如何将海康、大华、TP等监控摄像头、硬盘录像机的监控视频集成到网页中无插件播放,实现
    方法介绍今天我们介绍一个开放的监控接入平台NTVGBS,可以轻松实现将监控摄像头或录像机的监控视频信号集成到网页或APP中,并提供云台控制、录像回看等高级功能。NTVGBS是一款非常规范好用的开放监控平台,平台支持GB28181国标、RTMP/RTSP直播推送和ONVIF等开放规范,如果您有摄像头或......
  • 浅谈视频智能分析预警 事件识别算法硬件智能分析网关V2版的功能 及其智能分析网关V1版
    智能分析网关V1版本和智能分析网关V2版本相比,不仅在硬件外观上有所改变,而且在算法类别上也增加了一些新的内容。因此,今天我们将重点介绍智能分析网关V2版本的相关特性。智能分析网关V2是一种先进的数据处理设备,它融合了云计算、物联网和人工智能技术,主要应用于工业生产环境中......
  • 视频直播源码,AndroidStudio登录页面的切换
    视频直播源码,AndroidStudio登录页面的切换xml代码 <?xmlversion="1.0"encoding="utf-8"?><RelativeLayoutxmlns:android="http://schemas.android.com/apk/res/android"  xmlns:app="http://schemas.android.com/apk/res-auto"  ......
  • 音视频开发基础入门|声音的采集与量化、音频数字信号质量、音频码率
     栏目介绍:为了帮助开发者更好的理解音视频概念,进行音视频应用开发,ZEGO即构科技联合内部音视频开发专家打磨了本套《音视频开发进阶》课程,帮助大家轻松入门并可以自己动手开发音视频App!本次课程为系列内容,课程将从音视频基础概念讲解展开,进行学习内容的难度进阶,后期将带领大家学......
  • 音视频开发基础入门|声音的采集与量化、音频数字信号质量、音频码率
      栏目介绍:为了帮助开发者更好的理解音视频概念,进行音视频应用开发,ZEGO即构科技联合内部音视频开发专家打磨了本套《音视频开发进阶》课程,帮助大家轻松入门并可以自己动手开发音视频App!本次课程为系列内容,课程将从音视频基础概念讲解展开,进行学习内容的难度进阶,后期将带领......
  • FFMPEG+SDL简单视频播放器——视频快进
    之前写过一篇关于视频播放器的文章。播放器只简单实现了视频播放的功能,在此功能的基础上,给它加上一个视频快进的功能。实现添加参数//videoplaycontrolbooldo_seek=false;//播放状态int64_tseek_length=5;//快进秒数int64_tseek_pos;//视频跳转......
  • 基于扩频的数字视频水印嵌入和检测算法matlab仿真
    1.算法运行效果图预览 2.算法运行软件版本matlab2022a 3.算法理论概述     在MPEG压缩标准中,数据流是以多路复合流的格式存储和传输的。多路复合流由音频流和视频流复合组成。多路复合流的基本单位时包,而一个包由三个组组成。组分为视频组和音频组,在此只介绍视......