Question

我有一个视频标签，在Safari，Chrome中可以正常使用，但在iPad / iPhone上则无法正常使用。我做错了什么。

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

js code

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因播放视频而非常挑剔而臭名昭着。以下是一些要检查的内容：

使用H.264 Baseline Profile编码的视频（其他配置文件无法保证在iOS下播放）
使用适当的内容类型标头投放的视频文件（binary/octet-stream在iOS上无效）
如果您最终在<source type="foo" src="bar" />中使用<video />标记，请确保type属性的值与服务器提供的content-type标题完全匹配 - 这是区分大小写的。
提供视频文件的服务器必须支持字节范围请求 - 如果出现问题，iOS Safari的开发者控制台应该按照这些行显示投诉。

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

html5视频无法在iPad上播放

1 个答案: