lv.js 是 HTML5 Flash 視頻（FLV）播放器，純原生 JavaScript 開發(fā)，沒有用到 Flash。由 bilibili 網(wǎng)站開源。

該項(xiàng)目依托于 Media Source Extensions，受到 hls.js 的啟發(fā)。

概覽：

一個實(shí)現(xiàn)了在 HTML5 視頻中播放 FLV 格式視頻的 JavaScript 庫。它的工作原理是將 FLV 文件流轉(zhuǎn)碼復(fù)用成 ISO BMFF（MP4 碎片）片段，然后通過 Media Source Extensions 將 MP4 片段喂進(jìn)瀏覽器。

flv.js 是使用 ECMAScript 6 編寫的，然后通過 Babel Compiler 編譯成 ECMAScript 5，使用 Browserify 打包。

功能：

• FLV 容器，具有 H.264 + AAC 編解碼器播放功能
• 多部分分段視頻播放
• HTTP FLV 低延遲實(shí)時(shí)流播放
• FLV 通過 WebSocket 實(shí)時(shí)流播放
• 兼容 Chrome, FireFox, Safari 10, IE11 和 Edge
• 十分低開銷，并且通過你的瀏覽器進(jìn)行硬件加速

地址

https://github.com/Bilibili/flv.js

鼠下載

http://www.flvcd.com/

支持的網(wǎng)站：

搜狐視頻下載

用客戶端下載的是ifox專用格式，可用碩鼠下載mp4格式；

騰訊視頻下載

用客戶端下載的是qlv專用格式，可以將緩存文件夾下的copy /b命令轉(zhuǎn)到mp4；

copy /b E:\tencent\ vodcache\*.tdl hb.mp4

土豆和優(yōu)酷視頻下載

優(yōu)酷下載的視頻，分為三種不同的格式（標(biāo)清flv 、高清mp4、超清kux），但他們的客戶端都可以提供格式轉(zhuǎn)換功能；

愛奇藝視頻下載

用客戶端下載的是專用格式qsv，可以先下載一個小工具（http://www.cr173.com/soft/50011.html）轉(zhuǎn)換到flv，然后用格式工廠轉(zhuǎn)換。

有些網(wǎng)站可以邊播放邊下載

如風(fēng)行網(wǎng)客戶端；

其它網(wǎng)站下載

如電影天堂http://www.dytt8.net/html/gndy/dyzz/20130606/42349.html

找到下載資源→復(fù)制下載的ftp地址→打開一個下載軟件，如迅雷→新建下載→粘貼→立即下載；

下載到MKV格式后，再使用魔影工廠轉(zhuǎn)換為mp4

http://www.moying.cn/

-End-

易視頻云是網(wǎng)易傾力打造的一款基于云計(jì)算的分布式多媒體處理集群和專業(yè)音視頻技術(shù)，提供穩(wěn)定流暢、低時(shí)延、高并發(fā)的視頻直播、錄制、存儲、轉(zhuǎn)碼及點(diǎn)播等音視頻的PAAS服務(wù)，在線教育、遠(yuǎn)程醫(yī)療、娛樂秀場、在線金融等各行業(yè)及企業(yè)用戶只需經(jīng)過簡單的開發(fā)即可打造在線音視頻平臺。今天，網(wǎng)易視頻云就給大家分享關(guān)于用Nginx搭建flv,mp4,hls流媒體服務(wù)器的技術(shù)干貨！

模塊:nginx_mod_h264_streaming（支持h264編碼MP4格式的視頻）

模塊:http_flv_module （支持flv）

模塊:http_mp4_module （支持mp4）

模塊: nginx-rtmp-module （支持rtmp協(xié)議，也支持HLS）

（1）模塊下載和解壓

wget http://nginx.org/download/nginx-1.6.0.tar.gz

wget http://h264.code-shop.com/download/nginx_mod_h264_streaming-2.2.7.tar.gz

wget http://sourceforge.net/projects/pcre/files/pcre/8.35/pcre-8.35.tar.gz

wget http://zlib.net/zlib-1.2.8.tar.gz

wget http://www.openssl.org/source/openssl-1.0.1g.tar.gz

wget -O nginx-rtmp-module.zip https://github.com/arut/nginx-rtmp-module/archive/master.zip

unzip nginx-rtmp-module.zip

tar -zxvf nginx-1.6.0.tar.gz

tar -zxvf nginx_mod_h264_streaming-2.2.7.tar.gz

tar -zxvf pcre-8.35.tar.gz

tar -zxvf zlib-1.2.8.tar.gz

tar -zxvf openssl-1.0.1g.tar.gz

（2）配置命令，會生成makefile文件

./configure \

--prefix=/usr/local/nginx \

--add-module=../nginx_mod_h264_streaming-2.2.7 \

--add-module=../nginx-rtmp-module \

--with-http_flv_module \

--with-http_mp4_module \

--with-http_stub_status_module \

--with-http_ssl_module \

--with-pcre=../pcre-8.35 \

--with-zlib=../zlib-1.2.8 \

--with-debug

（3）編譯和安裝

make

make install

（4）問題解決

【1】如果在configure過程中出現(xiàn)以下錯誤：

/root/nginx_mod_h264_streaming-2.2.7/src/ngx_http_streaming_module.c: In function ‘ngx_streaming_handler’:

/root/nginx_mod_h264_streaming-2.2.7/src/ngx_http_streaming_module.c:158: error: ‘ngx_http_request_t’ has no member named ‘zero_in_uri’

make[1]: *** [objs/addon/src/ngx_http_h264_streaming_module.o] Error 1

make[1]: Leaving directory `/root/nginx-0.8.54'

make: *** [build] Error 2

那么將src/ngx_http_streaming_module.c文件中以下代碼刪除或者是注釋掉就可以了：

/* TODO: Win32 */

if (r->zero_in_uri)

{

return NGX_DECLINED;

}

如果你沒有對這個文件做個更改，那么應(yīng)該在源碼的第157-161行。這個問題是由于版本原因引起，在此不再討論。

修改完之后，記得先執(zhí)行make clean，然后再進(jìn)行重新執(zhí)行configure、make，最后make install。

【2】如果在編譯過程中出現(xiàn)以下錯誤：

cc1: warnings being treated as errors

那么修改/nginx-1.6.0/objs/Makefile文件

CFLAGS = -pipe -O -W -Wall -Wpointer-arith -Wno-unused-parameter -Werror -g -D_LARGEFILE_SOURCE -DBUILDING_NGINX -I../nginx-rtmp-module-master

把上面的 -Werror去掉，不把warnning當(dāng)作error處理

（5）Nginx的配置

#user nobody;

worker_processes 1;

#error_log logs/error.log;

#error_log logs/error.log notice;

#error_log logs/error.log info;

#pid logs/nginx.pid;

events {

worker_connections 1024;

}

rtmp {

server {

listen 1935;

chunk_size 4000;

# video on demand for flv files

application vod {

play /usr/local/nginx/html/flv;

}

# video on demand for mp4 files

application vod2 {

play /usr/local/nginx/html/mp4;

}

application hls {

live on;

hls on;

hls_path /tmp/hls;

}

# MPEG-DASH is similar to HLS

application dash {

live on;

dash on;

dash_path /tmp/dash;

}

}

}

http {

include mime.types;

default_type application/octet-stream;

#log_format main '$remote_addr - $remote_user [$time_local] "$request" '

# '$status $body_bytes_sent "$http_referer" '

# '"$http_user_agent" "$http_x_forwarded_for"';

#access_log logs/access.log main;

sendfile on;

#tcp_nopush on;

#keepalive_timeout 0;

keepalive_timeout 65;

#gzip on;

server {

# in case we have another web server on port 80

listen 8080;

server_name localhost;

#charset koi8-r;

#access_log logs/host.access.log main;

location / {

root html;

index index.html index.htm;

}

#error_page 404 /404.html;

# redirect server error pages to the static page /50x.html

#

error_page 500 502 503 504 /50x.html;

location = /50x.html {

root html;

}

location ~ \.mp4$ {

mp4;

}

location ~ \.flv$ {

flv;

}

# This URL provides RTMP statistics in XML

location /stat {

rtmp_stat all;

rtmp_stat_stylesheet stat.xsl;

}

location /stat.xsl {

# XML stylesheet to view RTMP stats.

# Copy stat.xsl wherever you want

# and put the full directory path here

root /var/www/;

}

location /hls {

# Serve HLS fragments

types {

application/vnd.apple.mpegurl m3u8;

video/mp2t ts;

}

#where the m3u8 and ts files are

alias /usr/local/nginx/html/hls;

#live streaming setting

#root /tmp;

#add_header Cache-Control no-cache;

}

location /dash {

# Serve DASH fragments

root /tmp;

add_header Cache-Control no-cache;

}

}

}

（6）用ffmpeg生成測試序列

【1】對于mp4文件，生成moov信息前移的mp4格式,適合流媒體播放。

ffmpeg -i /home/administrator/Videos/Amelia_720p.mp4 -c:v libx264 -c:a libvo_aacenc -f mp4 -movflags faststart /home/administrator/Videos/moovfront.mp4

【2】對于flv文件，用flvmeta工具在metadata中注入關(guān)鍵幀的信息，支持隨意拖動播放。

ffmpeg -i/home/administrator/Videos/Baroness.mp4 -vcodec libx264 -acodec libvo_aacenc -b:a 128k -ar 44100 -ac 2 -f flv /home/administrator/Videos/Baroness.flv

flvmeta -U -m -k /home/administrator/Videos/Baroness.flv /home/administrator/Videos/Baroness_meta.flv

【3】對于flv的播放，或者直接生成f4v格式的文件。

ffmpeg -i /home/administrator/Videos/sample/vc1_1080p.mkv -acodec libfdk_aac -ac 2 -b:a 128k -ar 48000 -vcodec libx264 -pix_fmt yuv420p -profile:v main -level 32 -b:v 1000K -r 29.97 -g 30 -s 960x540 -f f4v /home/administrator/Videos/hddvd_1000k.f4v

（7）Nginx啟動，重啟，關(guān)閉命令

start nginx 開啟

nginx -s stop 快速關(guān)閉

nginx -s quit 完全關(guān)閉

nginx -s reload 修改過配置文件，快速關(guān)閉舊的，開啟新服務(wù)

nginx -s reopen 重新打開日志文件

[停止操作]

停止操作是通過向nginx進(jìn)程發(fā)送信號來進(jìn)行的

步驟1：查詢nginx主進(jìn)程號

ps -ef | grep nginx

在進(jìn)程列表里 面找master進(jìn)程，它的編號就是主進(jìn)程號了。

步驟2：發(fā)送信號

從容停止Nginx：

kill -QUIT 主進(jìn)程號

快速停止Nginx：

kill -TERM 主進(jìn)程號

強(qiáng)制停止Nginx：

pkill -9 nginx

另外， 若在nginx.conf配置了pid文件存放路徑則該文件存放的就是Nginx主進(jìn)程號，如果沒指定則放在nginx的logs目錄下。有了pid文 件，我們就不用先查詢Nginx的主進(jìn)程號，而直接向Nginx發(fā)送信號了，命令如下：

kill -信號類型 '/usr/nginx/logs/nginx.pid'

[平滑重啟]

如果更改了配置就要重啟Nginx，要先關(guān)閉Nginx再打開？不是的，可以向Nginx 發(fā)送信號，平滑重啟。

平滑重啟命令：

kill -HUP 主進(jìn)程號或進(jìn)程號文件路徑

或者使用

/usr/nginx/sbin/nginx -s reload

注意，修改了配置文件后最好先檢查一下修改過的配置文件是否正 確，以免重啟后Nginx出現(xiàn)錯誤影響服務(wù)器穩(wěn)定運(yùn)行。判斷Nginx配置是否正確命令如下：

nginx -t -c /usr/nginx/conf/nginx.conf

或者

/usr/nginx/sbin/nginx -t

（8）播放測試

啟動nginx后測試：

http://192.168.1.105/player.swf?type=http&file=test1.flv

說明： #我的ip是192.168.1.105

#player.swf是我的JW Player播放器

#http是表示居于http分發(fā)方式

#test1.flv是我的flv視頻文件

[flash]

http://localhost:8080/mediaplayer/player.swf?type=http&file=../mp4/HaroldKumar.mp4

http://localhost:8080/mediaplayer/player.swf?type=http&file=../flv/Baroness.flv

[hls --> flash]

http://localhost:8080/jwplayer/HLSprovider/test/jwplayer6/index2.html

[hls]

http://10.240.155.183:8080/hls/movie.m3u8

[rtmp --> http]

http://10.240.155.183:8080/flowplayer/index2.html

[live stream]

./ffmpeg -loglevel verbose -re -i /home/administrator/Videos/sample/h264_720p_hp_5.1_6mbps_ac3_unstyled_subs_planet.mkv -vcodec libx264 -vprofile baseline -acodec libmp3lame -ar 44100 -ac 2 -f flv rtmp://localhost:1935/hls/movie

更多技術(shù)分享，請關(guān)注網(wǎng)易視頻云官方網(wǎng)站（http://vcloud.163.com/）或者網(wǎng)易視頻云官方微信（vcloud163）進(jìn)行交流與咨詢。