使用 Nginx 服务器配置 flv、mp4，可以直接浏览器播放


由于需求，需要提供浏览器播放 mp4 和 flv 视频功能。首先浏览器直接支持 flv 和 mp4 格式。只需要在对应的 WEB 服务上完成配置即可。

注意，我的需求是通过浏览器直接播放 MP4，而不是服务器提供 RTMP 功能，使用 RTMP 又是另外一种配置。

服务器环境

Ubuntu 18.04 + nginx 1.14.0。完整的环境如下。

1
2
3
4
5
6
7
8
$ lsb_release -a
No LSB modules are available.
Distributor ID: Ubuntu
Description:    Ubuntu 18.04.5 LTS
Release:    18.04
Codename:   bionic
$ nginx -v
nginx version: nginx/1.14.0 (Ubuntu)

Nginx

安装 Nginx 服务

如果已经安装 Nginx 可以跳过本步骤。如果没有，请使用以下命令：

1
sudo apt install nginx

添加 Nginx 组件

1
sudo apt install nginx-extras

配置 Nginx

$ sudo vi /etc/nginx/sites-enabled/default

在 server 配置加增加如下：

1
2
3
4
5
6
7
8
        location ~ \.mp4 {
                root /data/movie;
                mp4;
        }
        location ~ \.flv {
                root /data/movie;
                flv;
        }

注意：root 表示对应的跟目录位置。

然后保存配置。

验证配置

1
2
3
$ sudo nginx -t
nginx: the configuration file /etc/nginx/nginx.conf syntax is ok
nginx: configuration file /etc/nginx/nginx.conf test is successful

这样测试说明 nginx 配置是正确的。

重启启动 nginx 服务

1
$ sudo service nginx restart

验证

下面就是见证奇迹。我在 /data/movie 目录下有如下文件。

1
2
3
4
5
6
7
$ ls -al /data/movie/
total 85512
drwxr-xr-x 2 www-data www-data     4096 Mar  6  2020 .
drwxr-xr-x 7 root     root         4096 Oct 30 12:47 ..
-rw-rw-r-- 1 ubuntu   ubuntu   56532559 Mar  6  2020 Python3.mode1.mp4
-rw-rw-r-- 1 ubuntu   ubuntu   14278520 Mar  6  2020 Python3.mode2.mp4
-rw-rw-r-- 1 ubuntu   ubuntu   16740845 Mar  6  2020 Python3.mode3.mp4

打开浏览器，输入对应的 IP 地址，加上需要播放的 mp4 文件。如下图：

这样就可以正确播放出 MP4 文件了。

错误可能

浏览器有下载插件或者软件

最大的可能是你的浏览器上增加了自动下载功能。比如我用的 Firefox 有 IDM 插件，直接打开上面的 MP4 文件，就给 IDM 拦截了，开始自动下载功能。如下图。

解决方法：换浏览器，或者关闭 IDM 插件。

云主机没有打开对应的端口

这个问题在浏览器的显示应该是找不到网页。请确认云主机是否打开配置端口。

验证平台

本方法已经在：阿里云主机、腾讯云主机和 Win10+WSL2 机器上测试过。