obs+nginx-http-flv-module的流媒体服务搭建
一、编译带nginx-http-flv-module的nginx
个人编译好的：链接：https://pan.baidu.com/s/1XKkyYvK5W6yZA1w2mPaAfg
提取码：3ug6
nginx.zip文件夹
1 下载相关源码
1.1 nginx源代码下载
点击zip下载文件
1.2 下载nginx-http-flv-module
github地址：https://github.com/winshining/nginx-http-flv-module
1.3 下载 PCRE
下载地址：http://www.pcre.org/
备用：https://udomain.dl.sourceforge.net/project/pcre/pcre/8.45/pcre-8.45.zip
1.4 下载zlib
下载地址：http://zlib.net/
备用：https://udomain.dl.sourceforge.net/project/libpng/zlib/1.2.11/zlib-1.2.11.tar.gz
1.5 下载OpenSSL
下载地址：https://www.openssl.org/
2 编译准备
2.1 将nginx解压到nginx文件夹
2.2 新建objs
在nginx目录西面新建objs文件夹，并在objs文件夹下面建lib文件夹，创建好后将nginx-http-flv-module，PCRE，zlib，OpenSSL解压到lib文件夹下面。
2.3 准备软件
- MSYS:https://www.msys2.org/
- visual studio: https://visualstudio.microsoft.com/zh-hans/
- perl:https://www.perl.org/get.html
3 编译开始编译
3.1 MSYS工具
打开MSYS2 MSYS，使用cd命令来到nginx文件夹下，执行以下命令(注意：objs文件夹下的路径要写对，如果下载版本和我的不一致，需要对应修改文件名)
auto/configure \
--with-cc=cl \
--with-debug \
--prefix= \
--conf-path=conf/nginx.conf \
--pid-path=logs/nginx.pid \
--http-log-path=logs/access.log \
--error-log-path=logs/error.log \
--sbin-path=nginx.exe \
--http-client-body-temp-path=temp/client_body_temp \
--http-proxy-temp-path=temp/proxy_temp \
--http-fastcgi-temp-path=temp/fastcgi_temp \
--http-scgi-temp-path=temp/scgi_temp \
--http-uwsgi-temp-path=temp/uwsgi_temp \
--with-cc-opt=-DFD_SETSIZE=1024 \
--with-pcre=objs/lib/pcre-8.45 \
--with-zlib=objs/lib/zlib-1.2.11 \
--with-openssl=objs/lib/openssl-1.1.0i \
--with-openssl-opt=no-asm \
--add-module=objs/lib/nginx-http-flv-module \
--with-http_ssl_module \
Administrator@DESKTOP-VJ9LQ7M MINGW64 ~
# cd /d/a_devApp/z_nginx_1/dic/nginx/
Administrator@DESKTOP-VJ9LQ7M MINGW64 /d/a_devApp/z_nginx_1/dic/nginx
# auto/configure \
--with-cc=cl \
--with-debug \
--prefix= \
--conf-path=conf/nginx.conf \
--pid-path=logs/nginx.pid \
--http-log-path=logs/access.log \
--error-log-path=logs/error.log \
--sbin-path=nginx.exe \
--http-client-body-temp-path=temp/client_body_temp \
--http-proxy-temp-path=temp/proxy_temp \
--http-fastcgi-temp-path=temp/fastcgi_temp \
--http-scgi-temp-path=temp/scgi_temp \
--http-uwsgi-temp-path=temp/uwsgi_temp \
--with-cc-opt=-DFD_SETSIZE=1024 \
--with-pcre=objs/lib/pcre-8.45 \
--with-zlib=objs/lib/zlib-1.2.11 \
--with-openssl=objs/lib/openssl-1.1.0i \
--with-openssl-opt=no-asm \
--add-module=objs/lib/nginx-http-flv-module \
--with-http_ssl_module \
> ;
checking for OS
+ MINGW64_NT-10.0-18363 3.2.0-340.x86_64 x86_64
+ using Microsoft Visual C++ compiler
+ cl version:
auto/cc/msvc: line 117: [: : integer expression expected
checking for MINGW64_NT-10.0-18363 specific features
configuring additional modules
adding module in objs/lib/nginx-http-flv-module
+ ngx_http_flv_live_module was configured
creating objs/Makefile
Configuration summary
+ using PCRE library: objs/lib/pcre-8.45
+ using OpenSSL library: objs/lib/openssl-1.1.0i
+ using zlib library: objs/lib/zlib-1.2.11
nginx path prefix: ""
nginx binary file: "/nginx.exe"
nginx modules path: "/modules"
nginx configuration prefix: "/conf"
nginx configuration file: "/conf/nginx.conf"
nginx pid file: "/logs/nginx.pid"
nginx error log file: "/logs/error.log"
nginx http access log file: "/logs/access.log"
nginx http client request body temporary files: "temp/client_body_temp"
nginx http proxy temporary files: "temp/proxy_temp"
nginx http fastcgi temporary files: "temp/fastcgi_temp"
nginx http uwsgi temporary files: "temp/uwsgi_temp"
nginx http scgi temporary files: "temp/scgi_temp"
Administrator@DESKTOP-VJ9LQ7M MINGW64 /d/a_devApp/z_nginx_1/dic/nginx
#
3.2 nmake编译
点击windows图标，进入开始界面，找到“x86 Native Tools Command Pro…”并打开它，进入nginx文件夹。
如果出现如下信息则表明编译成功，这个时候在nginx西面创建好html，logs,temp文件夹并且将objs文件夹西面的nginx.exe复制到nginx西面以后就能启动 使用了。
注意：
- sed命令找不到：可以去安装的git下面查找有没有对应的sed.exe文件如果有的话，直接配置对应路径的环境变量，错误就能解决。
- 中间还配置了vscode studio下面的rc.exe的环境变量才能编译完成
二 做obs推流到nginx,并且实现h5播放
1 nginx配置
在http的server中加入如下配置
# 在http的server中加入
location /live {
flv_live on; #当HTTP请求以/live结尾，匹配这儿，这个选项表示开启了flv直播播放功能
chunked_transfer_encoding on; #HTTP协议开启Transfer-Encoding: chunked;方式回复
add_header 'Access-Control-Allow-Origin' '*'; #添加额外的HTTP头
add_header 'Access-Control-Allow-Credentials' 'true'; #添加额外的HTTP头
}
在外层加入如下配置
rtmp {
server {
listen 1935; #Nginx监听的RTMP推流/拉流端口
application live {
live on; #当推流时，RTMP路径中的APP（RTMP中一个概念）匹配myapp时，开启直播
record off; #不记录视频
gop_cache off;
}
}
}
2 obs配置
- 在电脑上面下载安装obs
- 添加采集器
-
设置加推流
服务器地地址：rtmp:[ip]:[port]/live ip:是nginx的ip地址port 是配置文件中配置的地址 live也是配置文件中配置。
3 编写html
-
flv.js下载地址：https://github.com/bilibili/flv.js/releases/download/v1.5.0/flv.min.js
-
html代码
<!DOCTYPE html> <html> <head> <meta content="text/html; charset=utf-8" http-equiv="Content-Type"> <title>flv.js demo</title> <style> .mainContainer { display: block; width: 1024px; margin-left: auto; margin-right: auto; } .urlInput { display: block; width: 100%; margin-left: auto; margin-right: auto; margin-top: 8px; margin-bottom: 8px; } .centeredVideo { display: block; width: 100%; height: 576px; margin-left: auto; margin-right: auto; margin-bottom: auto; } .controls { display: block; width: 100%; text-align: center; margin-left: auto; margin-right: auto; } </style> </head> <body> <p class="mainContainer"> <video name="videoElement" id="videoElement" class="centeredVideo" controls muted autoplay width="1024" height="576"> Your browser is too old which doesn't support HTML5 video. </video> </p> <script src="js/flv.min.js"></script> <script> function start() { if (flvjs.isSupported()) { var videoElement = document.getElementById('videoElement'); var flvPlayer = flvjs.createPlayer({ type: 'flv', url: 'http://172.16.90.102/live?port=1935&app=live&stream=035c73f7-bb6b-4889-a715-d9eb2d1925cc' }); flvPlayer.attachMediaElement(videoElement); flvPlayer.load(); flvPlayer.play(); } } document.addEventListener('DOMContentLoaded', function () { start(); }); </script> </body> </html>
参考文档：
https://blog.youkuaiyun.com/byna11sina11/article/details/117735684
https://blog.youkuaiyun.com/flyawayl/article/details/108218807
373
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
