由于女朋友公司要求每天需要錄屏并分享視頻鏈接給上面檢閱視頻制作鏈接，很多第三方速度太慢或者要收費，本著自己擼起袖子干的原則，就幫他搭建一個本地的服務對外暴露視頻鏈接，本來以為是一件很簡單的事情，結果牽扯到的只是還不少，關于視頻流傳輸的方式，還有推流和拉流等等相關知識，以及視頻轉碼工具...... 然后我就迷茫了，觸碰到知識盲區了，經過一上午的學習，粗魯的搭建了一個可以用的簡陋的服務器，由于功能需要很簡單，所以搭建起來也很快：

搭建流程：1.本地使用golang的gin搭建本地服務器，然后做端口映射，暴露給外界使用2.視頻傳輸的方式采用的HLS的方式，這里需要使用ffmpeg工具將錄屏的mp4文件轉化為HLS文件，該文件有m3u8索引和ts視頻切片文件組成3.然后播放端，采用網頁的形式，由于當前的html5無法直接播放hls形式的視頻，所以需要使用手段來播放

ok，流程大概如上面所示，接下來就開始搭建了，首先在我們將錄好的視頻使用ffmpeg的方式轉化為hls的形式：

ffmpeg -i input.mp4 -profile:v baseline -level 3.0 -s 640x360 -start_number 0 -hls_time 10 -hls_list_size 0 -f hls -strict -2 index.m3u8

這樣我們就將文件轉化完畢了，其中有 -i 表示輸入源，也就是我們的視頻視頻制作鏈接， -s 表示我們視頻的分辨率， -start_number 是開始時間，這里我們設為0，表示從開頭開始，后面的hls_time表示每一個切片的時間為10， -f表示格式為hls， 最終生成了index.m3u8的索引文件。

第二步，我們開始搭建服務器：

package mainimport ( "github.com/gin-gonic/gin" cors "github.com/itsjamie/gin-cors")func main() { s := gin.Default() // 跨域請求允許 // 一般只需要在服務器端設置 s.Use(cors.Middleware(cors.Config{ ValidateHeaders: false, Origins: "*", RequestHeaders: "", ExposedHeaders: "", Methods: "", MaxAge: 0, Credentials: false, })) // 開啟靜態文件托管 // videos目錄下是 /video1/我們的轉化之后的文件 s.Static("/videos/","videos") s.Static("/htmls/", "htmls") _ = s.Run(":8000")}

服務器搭建完畢，接下來我們來編寫播放端，由于我們使用的html5自帶的播放器，然后只需要通過js中的function來實現對hls流文件的播放就可以了，video.html如下：

<html lang="en"><head> <link href="http://www.xldzh.cn///7.4.1/video-js.css" rel="stylesheet">head><body><video id="example-video" class="video-js vjs-default-skin" controls="controls" width="900" height="600"> <source src="http://localhost:8000/videos/video1/index.m3u8" type="application/x-mpegURL" />video><script src="http://www.xldzh.cn///7.4.1/video.min.js">script><script> var player = videojs('example-video');script>body>html>

在里面的src處填寫我們的服務器托管的所以文件即可。最后我們訪問我們的video.html就可以觀看到視頻了。

附上兩張截圖：

播放前

播放中，我們可以通過控件來調整參數

最后附一下倉庫的地址：

文章來源:http://www.xldzh.cn///p/377836682