Question

我在我的某个网站上实施了HTML 5视频播放器。我正在使用videoJS。在我的桌面上，视频显示正常，但在我的iPad上它甚至没有加载视频。这是播放器的HTML：

<video id="ecoachingVideo" class="video-js vjs-default-skin" controls="controls"  autoplay="autoplay" preload="none" width="640" height="360" data-setup="{}">
</video>

此外，这里是将视频源添加到视频中的JavaScript（重新）加载视频：

player1.ready(function () {
    player1.src([
        { type: "video/mp4", src: "Film.aspx?videoId=" + videoID + "&videoType=mp4" },
        { type: "video/ogg", src: "Film.aspx?videoId=" + videoID + "&videoType=ogg" },
        { type: "video/webm", src: "Film.aspx?videoId=" + videoID + "&videoType=webm" }
    ]);
    //player1.poster("Screenshot.aspx?videoId=" + videoID);
    player1.load();
});

在上面的代码中，player1是html视频的videoJS对象，videoID已正确设置。视频源会导致构建HTTP响应的页面。构建响应的代码如下：

//--- obtaining video according to settings
string videoPath = this.getPathOfVideo(videoId);
FileStream video = new FileStream(videoPath, FileMode.Open);
var videoFile = new FileInfo(videoPath);

//--- building the actual response
Response.StatusCode = 206;
Response.Clear();
Response.AddHeader("Content-Length", video.Length.ToString());
Response.AddHeader("Content-type", "video/" + videoType);
Response.AddHeader("Accept-Ranges", "bytes");
if (Request.Headers["Range"] != null && !Request.Headers["Range"].EndsWith("-"))
{
    Response.AddHeader("Content-Range", "bytes " + Request.Headers["Range"].Substring(6) + "/" + videoFile.Length);
}
else
{
    Response.AddHeader("Content-Range", "bytes " + 0 + "-" + (videoFile.Length - 1 + "/" + videoFile.Length));
}
video.Close();
Response.TransmitFile(videoPath);
Response.End();

在上面的代码中，GetVideoPath返回视频的正确路径。

我已经测试/修复的内容

我将mime类型添加到我服务器的web.config
当我在iPad上输入视频的直接路径时，视频播放正常，因此我认为文件中没有编解码器问题。
控件存在于播放器中。
循环属性未被使用。
我的服务器支持字节范围，因为我收到状态码为206的回复（当我使用chrome时）。

可能也有用的信息

当我将iPad连接到Mac并查看应包含视频文件的响应时，我发现没有请求标头，也没有响应标头。使用铬时，它们都存在。
这些是Chrome中收到的源请求的标头：

请求标题

接受： /

Accept-Encoding：identity; q = 1，*; q = 0

接受语言：NL-NL，NL; Q = 0.8，的en-US; Q = 0.6，连接; Q = 0.4

缓存控制：无缓存

连接：保活

主持人：[正确的主持人]

杂注：无缓存

范围：字节= 0 -

参考者：[正确的地址]

User-Agent：Mozilla / 5.0（Windows NT 6.2; WOW64）AppleWebKit / 537.36（KHTML，与Gecko一样）Chrome / 36.0.1985.143 Safari / 537.36

查询字符串参数

VIDEOID：32

的VideoType：MP4

响应标题

接受-范围：字节

缓存控制：私人

的Content-Length：1932210

内容范围：字节0-1932209 / 1932210

内容类型：视频/ MP4

日期：2014年8月19日星期二13:47:38 GMT

服务器：IIS / 7.5

X-ASPNET-版本：4.0.30319

X供电-通过：ASP.NET

X供电-BY-的Plesk：PleskWin

Answer 1

您无法在iOs或Android设备上自动播放视频或任何其他流。这是您必须处理的安全限制：

媒体流（音频或视频）只能在触摸事件后启动。
如果您需要打开另一个流，则必须在加载/播放之前触发另一个触摸事件。
最后，您一次只能加载/播放一个流。

只需在视频上方添加一个播放按钮即可触发video.play()。

html5视频没有在间接源上显示在ipad上

1 个答案: