1. 前言
上一次我们找到一些开源方案,目前我们先测试一下ffmpeg转hls播放的方式,看下延迟情况及兼容性情况,主要测试Windows、Linux和macOS中使用谷歌浏览器播放的情况。
后端结合我们之前的cgo部分,建立一个简单的http服务器,然后提供给前端调用。
2. wsl安装ffmpeg并转换rtsp为hls
1
|
sudo apt-get install ffmpeg |
可能报错:
“E: Failed to fetch http://archive.ubuntu.com/ubuntu/pool/universe/f/flite/libflite1_2.1-release-3_amd64.deb Connection failed [IP: 91.189.88.142 80]”
解决办法,可以选择直接源码编译安装:
1
2
3
4
5
6
7
|
wget https: //ffmpeg .org /releases/ffmpeg-4 .1. tar .bz2 tar -xjvf ffmpeg-4.1. tar .bz2 cd ffmpeg-4.1 sudo apt-get install yasm . /configure make && sudo make install ffmpeg -version |
ffmpeg转换rtsp为hls:
1
|
ffmpeg -i "rtsp://username:password@40.40.40.101/media/video1" -c copy -f hls -hls_time 2.0 -hls_list_size 0 -hls_wrap 15 "./test.m3u8" |
3. 前后端示例代码
3.1 后端go代码
我们使用go创建简单的http服务,然后利用ffmpg转换hls提供给前端。
需要鉴权时rtsp地址前加上用户名密码时即可,比如rtsp://username:password@xxx,用户名和密码之间用:隔开,和原本的地址用@隔开。
main.go:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
|
import ( "fmt" "net/http" "os/exec" "bytes" "io/ioutil" ) func Index(w http.ResponseWriter, r *http.Request) { content, _ := ioutil.ReadFile( "./index.html" ) w.Write(content) } func main () { http.HandleFunc( "/index" , Index) http.Handle( "/" , http.FileServer(http.Dir( "." ))) go func () { http.ListenAndServe( ":9000" , nil ) }() cmd := exec.Command( "ffmpeg" , "-i" , "rtsp://admin:admin@40.40.40.101/media/video1" , "-c" , "copy" , "-f" , "hls" , "-hls_time" , "2.0" , "-hls_list_size" , "0" , "-hls_wrap" , "15" , "./test.m3u8" ) var out bytes.Buffer var stderr bytes.Buffer cmd.Stdout = &out cmd.Stderr = &stderr err := cmd.Run() if err != nil { fmt. Println (fmt.Sprint(err) + ": " + stderr. String ()) return } fmt. Println ( "Result: " + out. String ()) } |
3.2 前端代码
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
|
<!DOCTYPE html> <html lang= "zh-CN" > <head> <meta charset= "UTF-8" > <title>前端播放m3u8格式视频</title> <link href= "https://vjs.zencdn.net/7.4.1/video-js.css" rel= "external nofollow" rel= "stylesheet" > <script src= 'https://vjs.zencdn.net/7.4.1/video.js' ></script> <script src= "https://cdnjs.cloudflare.com/ajax/libs/videojs-contrib-hls/5.15.0/videojs-contrib-hls.min.js" type= "text/javascript" ></script> <!-- videojs-contrib-hls 用于在电脑端播放 如果只需手机播放可以不引入 --> </head> <body> <style> .video-js .vjs-tech {position: relative !important;} </style> <div> <video id= "myVideo" class= "video-js vjs-default-skin vjs-big-play-centered" controls preload= "auto" data-setup= '{}' style= 'width: 100%;height: auto' > <source id= "source" src= "http://localhost:9000/test.m3u8" type= "application/x-mpegURL" ></source> </video> </div> <!--<div class= "qiehuan" style= "width:100px;height: 100px;background: red;margin:0 auto;line-height: 100px;color:#fff;text-align: center" >切换视频</div>--> </body> <script> // videojs 简单使用 var myVideo = videojs( 'myVideo' , { bigPlayButton: true , textTrackDisplay: false , posterImage: false , errorDisplay: false , }) myVideo.play() var changeVideo = function (vdoSrc) { if (/\.m3u8$/.test(vdoSrc)) { //判断视频源是否是m3u8的格式 myVideo.src({ src: vdoSrc, type: 'application/x-mpegURL' //在重新添加视频源的时候需要给新的type的值 }) } else { myVideo.src(vdoSrc) } myVideo.load(); myVideo.play(); } // var src = "./test.m3u8"; // document.querySelector('.qiehuan').addEventListener('click', function () { // changeVideo(src); // }) </script> |
4. 结果及评估
运行后端代码后访问localhost:9000即可查看视频,经测试延迟还是比较高的(我测试大致在5s-8s),如果要加上ptz控制的话没有实时感恐怕比较怪异,只适合简单的网络直播之类的,不太在乎一定的延迟。
以上就是go后端利用ffmpeg转hls做简单视频直播的详细内容,更多关于Go ffmpeg转hls视频直播的资料请关注服务器之家其它相关文章!
原文链接:https://blog.csdn.net/weixin_39510813/article/details/123542903