使用大名鼎鼎的ffmpeg，把視頻文件切片成m3u8，並且通過springboot，可以實現在線的點播。
想法
客戶端上傳視頻到服務器，服務器對視頻進行切片后，返回m3u8，封面等訪問路徑。可以在線的播放。
服務器可以對視頻做一些簡單的處理，例如裁剪，封面的截取時間。
視頻轉碼文件夾的定義
喜羊羊與灰太狼 // 文件夾名稱就是視頻標題
|-index.m3u8 // 主m3u8文件，里面可以配置多個碼率的播放地址
|-poster.jpg // 截取的封面圖片
|-ts // 切片目錄
|-index.m3u8 // 切片播放索引
|-key // 播放需要解密的AES KEY
實現
需要先在本機安裝FFmpeg，並且添加到PATH環境變量，如果不會先通過搜索引擎找找資料
工程
pom
<project xmlns="http://maven.apache.org/POM/4.0.0"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
<modelVersion>4.0.0</modelVersion>
<groupId>com.demo</groupId>
<artifactId>demo</artifactId>
<version>0.0.1-SNAPSHOT</version>
<parent>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-parent</artifactId>
<version>2.4.5</version>
<relativePath /> <!-- lookup parent from repository -->
</parent>
<dependencies>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-test</artifactId>
<scope>test</scope>
</dependency>
<dependency>
<groupId>org.junit.vintage</groupId>
<artifactId>junit-vintage-engine</artifactId>
<scope>test</scope>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
<exclusions>
<exclusion>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-tomcat</artifactId>
</exclusion>
</exclusions>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-undertow</artifactId>
</dependency>
<dependency>
<groupId>commons-codec</groupId>
<artifactId>commons-codec</artifactId>
</dependency>
<dependency>
<groupId>com.google.code.gson</groupId>
<artifactId>gson</artifactId>
</dependency>
</dependencies>
<build>
<finalName>${project.artifactId}</finalName>
<plugins>
<plugin>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-maven-plugin</artifactId>
<configuration>
<executable>true</executable>
</configuration>
</plugin>
</plugins>
</build>
</project>
配置文件
server:
port: 80
app:
# 存儲轉碼視頻的文件夾地址
video-folder: "C:\\Users\\Administrator\\Desktop\\tmp"
spring:
servlet:
multipart:
enabled: true
# 不限制文件大小
max-file-size: -1
# 不限制請求體大小
max-request-size: -1
# 臨時IO目錄
location: "${java.io.tmpdir}"
# 不延遲解析
resolve-lazily: false
# 超過1Mb，就IO到臨時目錄
file-size-threshold: 1MB
web:
resources:
static-locations:
- "classpath:/static/"
- "file:${app.video-folder}" # 把視頻文件夾目錄，添加到靜態資源目錄列表
TranscodeConfig，用於控制轉碼的一些參數
package com.demo.ffmpeg;
public class TranscodeConfig {
private String poster; // 截取封面的時間 HH:mm:ss.[SSS]
private String tsSeconds; // ts分片大小，單位是秒
private String cutStart; // 視頻裁剪，開始時間 HH:mm:ss.[SSS]
private String cutEnd; // 視頻裁剪，結束時間 HH:mm:ss.[SSS]
public String getPoster() {
return poster;
}
public void setPoster(String poster) {
this.poster = poster;
}
public String getTsSeconds() {
return tsSeconds;
}
public void setTsSeconds(String tsSeconds) {
this.tsSeconds = tsSeconds;
}
public String getCutStart() {
return cutStart;
}
public void setCutStart(String cutStart) {
this.cutStart = cutStart;
}
public String getCutEnd() {
return cutEnd;
}
public void setCutEnd(String cutEnd) {
this.cutEnd = cutEnd;
}
@Override
public String toString() {
return "TranscodeConfig [poster=" + poster + ", tsSeconds=" + tsSeconds + ", cutStart=" + cutStart + ", cutEnd="
+ cutEnd + "]";
}
}
MediaInfo，封裝視頻的一些基礎信息
package com.demo.ffmpeg;
import java.util.List;
import com.google.gson.annotations.SerializedName;
public class MediaInfo {
public static class Format {
@SerializedName("bit_rate")
private String bitRate;
public String getBitRate() {
return bitRate;
}
public void setBitRate(String bitRate) {
this.bitRate = bitRate;
}
}
public static class Stream {
@SerializedName("index")
private int index;
@SerializedName("codec_name")
private String codecName;
@SerializedName("codec_long_name")
private String codecLongame;
@SerializedName("profile")
private String profile;
}
// ----------------------------------
@SerializedName("streams")
private List<Stream> streams;
@SerializedName("format")
private Format format;
public List<Stream> getStreams() {
return streams;
}
public void setStreams(List<Stream> streams) {
this.streams = streams;
}
public Format getFormat() {
return format;
}
public void setFormat(Format format) {
this.format = format;
}
}
FFmpegUtils，工具類封裝FFmpeg的一些操作
package com.demo.ffmpeg;
import java.io.BufferedReader;
import java.io.File;
import java.io.IOException;
import java.io.InputStreamReader;
import java.nio.charset.StandardCharsets;
import java.nio.file.Files;
import java.nio.file.Path;
import java.nio.file.Paths;
import java.nio.file.StandardOpenOption;
import java.security.NoSuchAlgorithmException;
import java.util.ArrayList;
import java.util.List;
import javax.crypto.KeyGenerator;
import org.apache.commons.codec.binary.Hex;
import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import org.springframework.util.StringUtils;
import com.google.gson.Gson;
public class FFmpegUtils {
private static final Logger LOGGER = LoggerFactory.getLogger(FFmpegUtils.class);
// 跨平台換行符
private static final String LINE_SEPARATOR = System.getProperty("line.separator");
/**
* 生成隨機16個字節的AESKEY
* @return
*/
private static byte[] genAesKey () {
try {
KeyGenerator keyGenerator = KeyGenerator.getInstance("AES");
keyGenerator.init(128);
return keyGenerator.generateKey().getEncoded();
} catch (NoSuchAlgorithmException e) {
return null;
}
}
/**
* 在指定的目錄下生成key_info, key文件，返回key_info文件
* @param folder
* @throws IOException
*/
private static Path genKeyInfo(String folder) throws IOException {
// AES 密鑰
byte[] aesKey = genAesKey();
// AES 向量
String iv = Hex.encodeHexString(genAesKey());
// key 文件寫入
Path keyFile = Paths.get(folder, "key");
Files.write(keyFile, aesKey, StandardOpenOption.CREATE, StandardOpenOption.TRUNCATE_EXISTING);
// key_info 文件寫入
StringBuilder stringBuilder = new StringBuilder();
stringBuilder.append("key").append(LINE_SEPARATOR); // m3u8加載key文件網絡路徑
stringBuilder.append(keyFile.toString()).append(LINE_SEPARATOR); // FFmeg加載key_info文件路徑
stringBuilder.append(iv); // ASE 向量
Path keyInfo = Paths.get(folder, "key_info");
Files.write(keyInfo, stringBuilder.toString().getBytes(), StandardOpenOption.CREATE, StandardOpenOption.TRUNCATE_EXISTING);
return keyInfo;
}
/**
* 指定的目錄下生成 master index.m3u8 文件
* @param fileName master m3u8文件地址
* @param indexPath 訪問子index.m3u8的路徑
* @param bandWidth 流碼率
* @throws IOException
*/
private static void genIndex(String file, String indexPath, String bandWidth) throws IOException {
StringBuilder stringBuilder = new StringBuilder();
stringBuilder.append("#EXTM3U").append(LINE_SEPARATOR);
stringBuilder.append("#EXT-X-STREAM-INF:BANDWIDTH=" + bandWidth).append(LINE_SEPARATOR); // 碼率
stringBuilder.append(indexPath);
Files.write(Paths.get(file), stringBuilder.toString().getBytes(StandardCharsets.UTF_8), StandardOpenOption.CREATE, StandardOpenOption.TRUNCATE_EXISTING);
}
/**
* 轉碼視頻為m3u8
* @param source 源視頻
* @param destFolder 目標文件夾
* @param config 配置信息
* @throws IOException
* @throws InterruptedException
*/
public static void transcodeToM3u8(String source, String destFolder, TranscodeConfig config) throws IOException, InterruptedException {
// 判斷源視頻是否存在
if (!Files.exists(Paths.get(source))) {
throw new IllegalArgumentException("文件不存在：" + source);
}
// 創建工作目錄
Path workDir = Paths.get(destFolder, "ts");
Files.createDirectories(workDir);
// 在工作目錄生成KeyInfo文件
Path keyInfo = genKeyInfo(workDir.toString());
// 構建命令
List<String> commands = new ArrayList<>();
commands.add("ffmpeg");
commands.add("-i") ;commands.add(source); // 源文件
commands.add("-c:v") ;commands.add("libx264"); // 視頻編碼為H264
commands.add("-c:a") ;commands.add("copy"); // 音頻直接copy
commands.add("-hls_key_info_file") ;commands.add(keyInfo.toString()); // 指定密鑰文件路徑
commands.add("-hls_time") ;commands.add(config.getTsSeconds()); // ts切片大小
commands.add("-hls_playlist_type") ;commands.add("vod"); // 點播模式
commands.add("-hls_segment_filename") ;commands.add("%06d.ts"); // ts切片文件名稱
if (StringUtils.hasText(config.getCutStart())) {
commands.add("-ss") ;commands.add(config.getCutStart()); // 開始時間
}
if (StringUtils.hasText(config.getCutEnd())) {
commands.add("-to") ;commands.add(config.getCutEnd()); // 結束時間
}
commands.add("index.m3u8"); // 生成m3u8文件
// 構建進程
Process process = new ProcessBuilder()
.command(commands)
.directory(workDir.toFile())
.start()
;
// 讀取進程標准輸出
new Thread(() -> {
try (BufferedReader bufferedReader = new BufferedReader(new InputStreamReader(process.getInputStream()))) {
String line = null;
while ((line = bufferedReader.readLine()) != null) {
LOGGER.info(line);
}
} catch (IOException e) {
}
}).start();
// 讀取進程異常輸出
new Thread(() -> {
try (BufferedReader bufferedReader = new BufferedReader(new InputStreamReader(process.getErrorStream()))) {
String line = null;
while ((line = bufferedReader.readLine()) != null) {
LOGGER.info(line);
}
} catch (IOException e) {
}
}).start();
// 阻塞直到任務結束
if (process.waitFor() != 0) {
throw new RuntimeException("視頻切片異常");
}
// 切出封面
if (!screenShots(source, String.join(File.separator, destFolder, "poster.jpg"), config.getPoster())) {
throw new RuntimeException("封面截取異常");
}
// 獲取視頻信息
MediaInfo mediaInfo = getMediaInfo(source);
if (mediaInfo == null) {
throw new RuntimeException("獲取媒體信息異常");
}
// 生成index.m3u8文件
genIndex(String.join(File.separator, destFolder, "index.m3u8"), "ts/index.m3u8", mediaInfo.getFormat().getBitRate());
// 刪除keyInfo文件
Files.delete(keyInfo);
}
/**
* 獲取視頻文件的媒體信息
* @param source
* @return
* @throws IOException
* @throws InterruptedException
*/
public static MediaInfo getMediaInfo(String source) throws IOException, InterruptedException {
List<String> commands = new ArrayList<>();
commands.add("ffprobe");
commands.add("-i") ;commands.add(source);
commands.add("-show_format");
commands.add("-show_streams");
commands.add("-print_format") ;commands.add("json");
Process process = new ProcessBuilder(commands)
.start();
MediaInfo mediaInfo = null;
try (BufferedReader bufferedReader = new BufferedReader(new InputStreamReader(process.getInputStream()))) {
mediaInfo = new Gson().fromJson(bufferedReader, MediaInfo.class);
} catch (IOException e) {
e.printStackTrace();
}
if (process.waitFor() != 0) {
return null;
}
return mediaInfo;
}
/**
* 截取視頻的指定時間幀，生成圖片文件
* @param source 源文件
* @param file 圖片文件
* @param time 截圖時間 HH:mm:ss.[SSS]
* @throws IOException
* @throws InterruptedException
*/
public static boolean screenShots(String source, String file, String time) throws IOException, InterruptedException {
List<String> commands = new ArrayList<>();
commands.add("ffmpeg");
commands.add("-i") ;commands.add(source);
commands.add("-ss") ;commands.add(time);
commands.add("-y");
commands.add("-q:v") ;commands.add("1");
commands.add("-frames:v") ;commands.add("1");
commands.add("-f"); ;commands.add("image2");
commands.add(file);
Process process = new ProcessBuilder(commands)
.start();
// 讀取進程標准輸出
new Thread(() -> {
try (BufferedReader bufferedReader = new BufferedReader(new InputStreamReader(process.getInputStream()))) {
String line = null;
while ((line = bufferedReader.readLine()) != null) {
LOGGER.info(line);
}
} catch (IOException e) {
}
}).start();
// 讀取進程異常輸出
new Thread(() -> {
try (BufferedReader bufferedReader = new BufferedReader(new InputStreamReader(process.getErrorStream()))) {
String line = null;
while ((line = bufferedReader.readLine()) != null) {
LOGGER.error(line);
}
} catch (IOException e) {
}
}).start();
return process.waitFor() == 0;
}
}
UploadController，執行轉碼操作
package com.demo.web.controller;
import java.io.IOException;
import java.nio.file.Files;
import java.nio.file.Path;
import java.nio.file.Paths;
import java.time.LocalDate;
import java.time.format.DateTimeFormatter;
import java.util.HashMap;
import java.util.Map;
import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import org.springframework.beans.factory.annotation.Value;
import org.springframework.http.HttpStatus;
import org.springframework.http.ResponseEntity;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestPart;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.multipart.MultipartFile;
import com.demo.ffmpeg.FFmpegUtils;
import com.demo.ffmpeg.TranscodeConfig;
@RestController
@RequestMapping("/upload")
public class UploadController {
private static final Logger LOGGER = LoggerFactory.getLogger(UploadController.class);
@Value("${app.video-folder}")
private String videoFolder;
private Path tempDir = Paths.get(System.getProperty("java.io.tmpdir"));
/**
* 上傳視頻進行切片處理，返回訪問路徑
* @param video
* @param transcodeConfig
* @return
* @throws IOException
*/
@PostMapping
public Object upload (@RequestPart(name = "file", required = true) MultipartFile video,
@RequestPart(name = "config", required = true) TranscodeConfig transcodeConfig) throws IOException {
LOGGER.info("文件信息：title={}, size={}", video.getOriginalFilename(), video.getSize());
LOGGER.info("轉碼配置：{}", transcodeConfig);
// 原始文件名稱，也就是視頻的標題
String title = video.getOriginalFilename();
// io到臨時文件
Path tempFile = tempDir.resolve(title);
LOGGER.info("io到臨時文件：{}", tempFile.toString());
try {
video.transferTo(tempFile);
// 刪除后綴
title = title.substring(0, title.lastIndexOf("."));
// 按照日期生成子目錄
String today = DateTimeFormatter.ofPattern("yyyyMMdd").format(LocalDate.now());
// 嘗試創建視頻目錄
Path targetFolder = Files.createDirectories(Paths.get(videoFolder, today, title));
LOGGER.info("創建文件夾目錄：{}", targetFolder);
Files.createDirectories(targetFolder);
// 執行轉碼操作
LOGGER.info("開始轉碼");
try {
FFmpegUtils.transcodeToM3u8(tempFile.toString(), targetFolder.toString(), transcodeConfig);
} catch (Exception e) {
LOGGER.error("轉碼異常：{}", e.getMessage());
Map<String, Object> result = new HashMap<>();
result.put("success", false);
result.put("message", e.getMessage());
return ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR).body(result);
}
// 封裝結果
Map<String, Object> videoInfo = new HashMap<>();
videoInfo.put("title", title);
videoInfo.put("m3u8", String.join("/", "", today, title, "index.m3u8"));
videoInfo.put("poster", String.join("/", "", today, title, "poster.jpg"));
Map<String, Object> result = new HashMap<>();
result.put("success", true);
result.put("data", videoInfo);
return result;
} finally {
// 始終刪除臨時文件
Files.delete(tempFile);
}
}
}
index.html，客戶端
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="https://cdn.jsdelivr.net/hls.js/latest/hls.min.js"></script>
</head>
<body>
選擇轉碼文件： <input name="file" type="file" accept="video/*" onchange="upload(event)">
<hr/>
<video id="video" width="500" height="400" controls="controls"></video>
</body>
<script>
const video = document.getElementById('video');
function upload (e){
let files = e.target.files
if (!files) {
return
}
// TODO 轉碼配置這里固定死了
var transCodeConfig = {
poster: "00:00:00.001", // 截取第1毫秒作為封面
tsSeconds: 15,
cutStart: "",
cutEnd: ""
}
// 執行上傳
let formData = new FormData();
formData.append("file", files[0])
formData.append("config", new Blob([JSON.stringify(transCodeConfig)], {type: "application/json; charset=utf-8"}))
fetch('/upload', {
method: 'POST',
body: formData
})
.then(resp => resp.json())
.then(message => {
if (message.success){
// 設置封面
video.poster = message.data.poster;
// 渲染到播放器
var hls = new Hls();
hls.loadSource(message.data.m3u8);
hls.attachMedia(video);
} else {
alert("轉碼異常，詳情查看控制台");
console.log(message.message);
}
})
.catch(err => {
alert("轉碼異常，詳情查看控制台");
throw err
})
}
</script>
</html>
使用
- 在配置文件中，配置到本地視頻目錄后啟動
- 打開頁面
localhost - 點擊【選擇文件】，選擇一個視頻文件進行上傳，等待執行完畢（沒有做加載動畫）
- 后端轉碼完成后，會自動把視頻信息加載到播放器，此時可以手動點擊播放按鈕進行播放
可以打開控制台，查看上傳進度，以及播放時的網絡加載信息