DASH+nginx带宽自适应视频播放系统搭建

最新推荐文章于 2024-05-23 18:04:58 发布

woshicaiji12138

最新推荐文章于 2024-05-23 18:04:58 发布

阅读量881

点赞数 1

分类专栏：常识文章标签： dash nginx 音视频

本文链接：https://blog.csdn.net/woshicaiji12138/article/details/129493277

版权

常识专栏收录该内容

25 篇文章 0 订阅

订阅专栏

一、搭建服务器
1.1 ubuntu中
1下载源码
nginx的官网： http://nginx.org/en/download.html
在这里插入图片描述
一般选择stable version，下载之后解压：

tar -zxvf nginx-1.xxxxx.tar.gz

随后进入文件夹进行编译

cd nginx
./configure
make
make install

2 配置环境变量
nginx的默认路径为/usr/local/nginx/sbin

vim /etc/profile
NGINXPATH=/usr/local/nginx/sbin
export PATH=$PATH:$NGINXPATH
source /etc/profile

如果是实验室服务器没用权限的话，可以参考
linux下非root用户为自己设置环境变量&&-bash: nasm: 未找到命令问题的解决

3启动

nginx -t  测试配置文件
nginx -s reload  重载配置文件

4 验证
nginx的初始地址设置为localhost，因此在浏览器中输入localhost出现下图，表示nginx安装成功。
在这里插入图片描述

1.2 windows中
1下载包
在这里插入图片描述
2解压
3打开
在nginx.exe对应的cmd窗口用命令启动，不要直接双击nginx.exe。
启动命令

start nginx
nginx.exe

两种都可以，二选一即可。

4验证
同上。

二、视频处理
2.1视频处理软件
1安装
我的视频处理主要基于mp4box，下面提供安装方法

git clone https://github.com/gpac/gpac.git  
cd gpac  
git pull  
sudo ./configure --static-bin --prefix=/usr/local/MP4Box  
sudo make 
sudo make install

2 环境变量配置

vim /etc/profile
MP4BOXPATH=/usr/local/MP4Box/bin
export PATH=$PATH:$MP4BOXPATH
source /etc/profile

3验证

MP4Box -h

2.2 视频处理
1音视频分离
从音视频中分离出视频：

ffmpeg -i video.mp4 -vcodec copy -an video.mp4

从音视频中分离出音频：

ffmpeg -i video.mp4 -acodec copy -vn video.m4a

2视频切片

MP4Box -dash 2000 -rap -dash-profile dashavc264:onDemand -bs-switching no video1920x1080.mp4 vidoe1280x720.mp4 video640x360.mp4 video256x144.mp4 video.m4a -out ed.mpd

如上命令处理之后，可以生成以下文件

ed.mpd
video1920x1080_dashinit.mp4
video1280x720_dashinit.mp4
video640x360_dashinit.mp4
video256x144_dashinit.mp4
video_dashinit.mp4

三、网页播放器
创建DashJS.html
复制以下内容

<!doctype html>
<html>
    <head>
        <title>Dash.js Rocks</title>
        <style>
            video {
                width: 640px;
                height: 360px;
            }
        </style>
    </head>
    <body>
        <div>
            <video id="videoPlayer" controls></video>
        </div>
        <script src="./dash.all.min.js"></script>
        <script>
            (function(){
                var url = "./ed.mpd";
                var player = dashjs.MediaPlayer().create();
                player.initialize(document.querySelector("#videoPlayer"), url, true);
            })();
        </script>
    </body>
</html>

这里需要的dash.all.min.js可以通过以下网站下载：
dash.all.min.js

四、修改nginx配置文件
注意，需要将dash.all.min.js、DashJS.html、ed.mpd、video1920x1080_dashinit.mp4、video1280x720_dashinit.mp4、video640x360_dashinit.mp4、video256x144_dashinit.mp4、video_dashinit.mp4放在一个文件夹中。这里在html中创建一个名为Dashdemo的文件夹，将它们放入。
接下来，修改conf配置文件
在路径/usr/local/nginx/conf(linux)或nginx/conf(windows)中找到nginx.conf文件。
在http中的server中添加如下内容：

location /Dashdemo{
            root   html;
            #index  index.html index.htm;
            
            if ($request_method = 'OPTIONS') {
                add_header Access-Control-Allow-Origin $http_origin;
                add_header Access-Control-Allow-Methods             
                $http_access_control_request_method;
                add_header Access-Control-Allow-Credentials true;
                add_header Access-Control-Allow-Headers 
                $http_access_control_request_method;
                add_header Access-Control-Max-Age 1728000;
                return 204;}
        }

注意。每次修改conf后需要进行nginx -s reload才能运行。

五、播放
接下来，在浏览器中输入ip地址:端口号/Dashdemo/DashJS.html就可以进行播放了。
在这里插入图片描述

woshicaiji12138

关注

1
点赞
踩
6

收藏

觉得还不错? 一键收藏
0
评论
DASH+nginx带宽自适应视频播放系统搭建

注意，需要将dash.all.min.js、DashJS.html、ed.mpd、video1920x1080_dashinit.mp4、video1280x720_dashinit.mp4、video640x360_dashinit.mp4、video256x144_dashinit.mp4、video_dashinit.mp4放在一个文件夹中。在路径/usr/local/nginx/conf(linux)或nginx/conf(windows)中找到nginx.conf文件。两种都可以，二选一即可。
复制链接

扫一扫

专栏目录