html5 视频无法在 iPad 中播放

Question

我有一个视频标签，它在 Safari、Chrome 中工作正常，但在 iPad/iPhone 上不行。我做错了什么。

<a onclick="showVideoPlayer('http://www.mywebsite.com/videos/a video file.m4v')" id="video1" href="#">Play video</a>

js代码

function showVideoPlayer(videoSrc, showDownloadLink){
            alert(videoSrc);
            if(!videoSrc)
                return;

            $('div#overlay').show();
            var $videoPlaceHolder = $('div#video-placeholder');
            $videoPlaceHolder.show();

            var $video = $videoPlaceHolder.find('video');

            var winWidth = $(window).width() - 80;
            var winHeight = $(window).height() - 120;

            $video.attr('src', videoSrc);
            $video.attr('width', winWidth + 'px');
            $video.attr('height', winHeight + 'px');
            $videoPlaceHolder.append($video);
            if(showDownloadLink){
                $('#video-placeholder .down').show();
            }

        }

Answer 1

iOS 因对播放视频过于挑剔而臭名昭著。以下是需要检查的一些事项：

1. 使用 H.264 基线配置文件编码的视频（不保证其他配置文件能够在 iOS 下播放）
2. 使用适当的内容类型标头 (binary/octet-stream 在 iOS 上不起作用）
3. 如果您最终在 中使用 标记>，确保该值type 属性与服务器提供的 content-type 标头完全匹配 - 区分大小写。
4. 提供视频文件的服务器必须支持字节范围请求 - 如果这是问题所在，iOS Safari 的开发者控制台应该显示类似的投诉。

这些是我遇到的最常见的错误（我在在线视频平台工作） - 希望您的问题会像找出您缺少的要求一样简单。