上传的视频不在移动浏览器中播放，而是在桌面浏览器中播放

Question

我已经设置了一个服务器（gunicorn 和 nginx）来使用 Python/Django 上传视频，并在浏览器中观看。我使用的视频播放器是videojs。所有视频都是 h.264 mp4。视频大小在 5-40 MB 之间。

视频上传正常，我也可以在台式机和笔记本浏览器上观看上传的视频。

问题是我无法在移动设备上观看相同的视频（在桌面浏览器上播放）。

我收到这个错误：

This video could not be loaded, either because the server or network failed or because the format is not supported.

怎么了？

更新

不过，我在移动设备和 Opera 中使用 webm 视频测试了移动浏览器，Chrome 可以完美播放视频。这是我用于 webm 的命令：

ffmpeg -i test2.mov -codec:v libvpx -quality good -cpu-used 0 -b:v 600k -maxrate 600k -bufsize 1200k -qmin 10 -qmax 42 -vf scale=-1:480 -threads 4 -codec:a vorbis -b:a 128k -strict -2 test2_webmmm.webm

这对于 h.264 mp4（仅适用于 firefox）：

ffmpeg -i inputfile.avi -codec:v libx264 -profile:v baseline -preset slow -b:v 250k -maxrate 250k -bufsize 500k -vf scale=-1:360 -threads 0 -codec:a libfdk_aac -b:a 96k output.mp4

更新

Input #0, mov,mp4,m4a,3gp,3g2,mj2, from 'faststart.mp4':
  Metadata:
    major_brand     : isom
    minor_version   : 512
    compatible_brands: isomiso2avc1mp41
    encoder         : Lavf56.40.100
  Duration: 00:03:36.56, start: 0.046440, bitrate: 350 kb/s
    Stream #0:0(und): Video: h264 (Constrained Baseline) (avc1 / 0x31637661), yu
v420p, 640x360 [SAR 1:1 DAR 16:9], 249 kb/s, 23.98 fps, 23.98 tbr, 24k tbn, 47.9
5 tbc (default)
    Metadata:
      handler_name    : VideoHandler
    Stream #0:1(und): Audio: aac (LC) (mp4a / 0x6134706D), 44100 Hz, stereo, flt
p, 96 kb/s (default)
    Metadata:
      handler_name    : SoundHandler

更新

以下是我一路上收集到的一些要点：

我从 YouTube 下载并在没有编码的情况下上传到服务器的一些视频在所有浏览器上都能很好地播放。
但是，如果我对同一视频（YouTube 视频）进行编码并将其上传到服务器，则它无法在移动设备上播放，只能在桌面浏览器上播放。
我从手机（Samsung s4 和 iPhone 6）拍摄并使用 ffmpeg 编码的视频不能在移动浏览器上播放，只能在桌面浏览器上播放。
但是，URL 托管在 Amazon s3 上的相同视频（我从手机上截取）在所有浏览器（甚至是非编码视频）上播放效果都很好。

Answer 1

什么官方文档tells:

流媒体和 AAC 播放器兼容性

By default when encoding AAC files using libfdk_aac the metadata ('moov' atom) is written after the audio stream ('mdat' atom) at the end of the file. In order to enable streaming of the encoded file the 'moov' atom has to be moved before the 'mdat' atom. In addition some AAC player implementations have issues decoding such files.

FFmpeg 提供选项“-movflags +faststart”，涵盖可在编码期间使用的功能：

ffmpeg -i input.wav -c:a libfdk_aac -movflags +faststart output.m4a

现有的 m4a 文件可以使用 'tools' 目录

中随 FFmpeg 分发的“qt-faststart”程序进行修改

qt-faststart input.m4a output.m4a

所以你可以试试这个：

ffmpeg -i inputfile.avi -codec:v libx264 -profile:v baseline -preset slow -b:v 250k -maxrate 250k -bufsize 500k -vf scale=-1:360 -threads 0 -codec:a libfdk_aac -movflags +faststart output.mp4

Answer 2

我检查了视频本身，它看起来很好，如果下载到桌面并使用 Chrome 或 Mac 上的 Safari 打开，则可以正常播放。

它也可以使用您在上面提供的 link (54.169.222.113/video/62 ) 在 Chrome 和 Mac 上正常播放，但不能在 Safari 上播放.它还将在默认浏览器和 Chrome.

中从网络 link 和 Android 平板电脑 (Samsung Note) 播放

不过，视频本身在 Safri 桌面上播放效果很好。这样做会绕过您的站点，包括您的脚本和 HTML 以及 video.js 播放器。

检查 videojs.com 站点，他们使用与您相同版本的 video.js (4.12.11)，但是当您查看源代码时，他们的行数似乎不同，这真的不应该是同一个版本号的情况。很可能他们只是添加了一些开发更改来测试，但我认为值得重新访问您的 HTML 和 video.js 设置并尝试尽可能接近地匹配它videojs.com 站点（我认为您将其用作起点，因为它很接近但目前不完全相同）。

更新

好的 - 我从您的 link 下载视频 1437658474_37_faststart.mp4，并将其作为简单的静态文件添加到本地 Web 服务器中。

视频在以下通过网络连接到服务器的客户端中播放正常：

Mac 野生动物园
Mac Chrome
Android 标准和 chrome 浏览器
iPhone 野生动物园

我还编辑了 videos.com 页面（在本地使用浏览器工具）并添加了您的视频，它不会播放。

您的视频在某些浏览器上似乎存在一个微妙的问题，该问题在使用 videojs 时表现出来 - 使用您的网站可以很容易地证明该问题：

视频从未在 MAC
视频始终在 Chrome 上在 MAC

除非您设法以某种方式离线解决问题（如果是这样请告诉我们，因为这是一个有趣的问题！），我认为值得在 videojs 论坛上提出。

Answer 3

我通过使用 qtfaststart (python) 进行两遍编码解决了我的问题。起初我使用 -movflags +faststart，但不知道为什么它不起作用。但现在它几乎适用于所有浏览器。

这是我使用的代码：

第一关

ffmpeg -i mobile.mp4 -codec:v libx264 -profile:v baseline -preset slow -b:v 250k -maxrate 250k -bufsize 500k -vf scale=-1:360 -threads 0 -codec:a libfdk_aac -movflags +faststart mobile-output.mp4

第二遍

qtfaststart mobile-output.mp4 qt-mobile-output.mp4

上传的视频不在移动浏览器中播放，而是在桌面浏览器中播放

Uploaded videos are not playing in mobile browser but are playing on desktop broswer

browser

video

mobile

nginx

video-streaming