XueChProject13(在线学习)

本文详细介绍了在线学习平台中录播模块的实现,涵盖了从需求分析到技术选型的全过程。通过流媒体技术,使用HLS协议将视频压缩并分割成ts小文件,借助FFmpeg进行编码,并利用video.js作为H5播放器。同时,文章讨论了媒资管理和端点续传的解决方案,如文件分块上传与合并,采用了webuploader前端组件。
摘要由CSDN通过智能技术生成

一、需求分析

本项目提供学生在线学习,包括录播、直播、图文等,我负责的模块是录播

1、学生可以在windows浏览器上在线观看视频。
2、播放器具有快进、快退、暂停等基本功能。
3、学生可以方便切换章节进行学习。

二、解决方案

流媒体----->将原视频通过压缩上传到服务器,为了节约空间,压缩后的视频会变小,客户端通过解压的方式获取视频文件。

流式传输有两种方式:

一、顺序流式播放 不能快进,只能按照顺序播放
二、实时流式传输 可以快进

一、流媒体的业务流程图 在这里插入图片描述

图中的编码就是压缩

2.1、我们选择第二种实时流式传输,解决这种需求,我们选择的技术方案是:

HLS协议------------>avi ----------> n个 ts 小文件 + m3u8索引文件 ;
流程:

在这里插入图片描述

三、视频编码

【视频文件格式】和【视频文件编码格式】是不一样的。

视频文件格式:.mp4、.avi、.rmvb等

视频文件编码格式:MPEG系列 、H26x-------->视频压缩的格式

3.1、FFmpeg视频编码工具

3.1.1、资料里面有FFmpeg.exe文件,可以设置环境变量

3.2、将avi文件转换为m3u8和ts文件的过程,如下图:

在这里插入图片描述

说明:
.m3u8 索引文件 : 记录的是整个avi拆分的ts文件有哪些, ts文件先后顺序 , ts各个文件时长是多长 ;
.ts 文件 : 每一个都是一小段视频 ;

五、播放器的选择

5.1、播放器分类有:H5、flash(需要下载Adobe flash player)、浏览器插件。本项目采用H5 中的video.js开源播放器(它支持H5和flash)。

六、服务器的选择

6.1、HLS协议基于Http协议、本项目采用Nginx来作为视频播放器

在这里插入图片描述

在这里插入图片描述

七、媒资管理

7.1、需求分析

媒资查询:教学机构查询自己所拥有的媒体文件。
视频上传:将用户线下录制的教学视频上传到媒资系统。
视频处理:视频上传成功,系统自动对视频进行编码处理。
视频删除 :如果该视频已不再使用,可以从媒资系统删除。

在这里插入图片描述

7.2、端点续传的解决方案

在这里插入图片描述

上传流程如下:

1、上传前先把文件分成块
2、一块一块的上传,上传中断后重新上传,已上传的分块则不用再上传
3、各分块上传完成最后合并文件

7.3、文件分块代码实现,java代码如下,本项目采用的是在前端,用js实现文件分块,原理和java实现的一样。

package com.xuecheng.manage_media;

import org.junit.Test;
import org.junit.runner.RunWith;
import org.springframework.boot.test
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值