Javascript html5视频未使用间接源在ipad上显示
我正在我的一个网站上实现一个HTML5视频播放器。我正在使用videoJS。在我的桌面上,视频显示良好,但在我的iPad上,它甚至没有加载视频。以下是播放器的HTML:Javascript html5视频未使用间接源在ipad上显示,javascript,ios,html,ipad,video,Javascript,Ios,Html,Ipad,Video,我正在我的一个网站上实现一个HTML5视频播放器。我正在使用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 id="ecoachingVideo" class="video-js vjs-default-skin" controls="controls" autoplay="autoplay" preload="none" width="640" height="360" data-setup="{}">
</video>
在上面的代码中,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上输入视频的直接路径时,视频可以正常播放,因此我相信文件中不存在编解码器问题。
播放器中存在控件。
据我所知,没有使用循环属性。
我的服务器支持字节范围,因为我在使用chrome时收到状态代码为206的响应。
也可能有用的信息
当我将iPad连接到mac电脑上,查看应该包含视频文件的响应时,我发现没有请求头,也没有响应头。使用chrome时,它们都存在
以下是在Chrome中收到的源请求的标题:
请求头
接受:/
接受编码:身份;q=1,*;q=0
接受语言:nl nl,nl;q=0.8,在美国;q=0.6,en;q=0.4
缓存控制:没有缓存
连接:保持活力
主机:[正确的主机]
Pragma:没有缓存
范围:字节=0-
推荐人:[正确地址]
用户代理:Mozilla/5.0 Windows NT 6.2;WOW64 AppleWebKit/537.36 KHTML,如Gecko Chrome/36.0.1985.143 Safari/537.36
查询字符串参数
视频识别码:32
视频类型:mp4
响应头
接受范围:字节
缓存控制:专用
内容长度:1932210
内容范围:字节0-1932209/1932210
内容类型:视频/mp4
日期:2014年8月19日星期二13:47:38 GMT
服务器:Microsoft IIS/7.5
X-AspNet-Version:4.0.30319
X-Powered-By:ASP.NET
X-Powered-By-Plesk:PleskWin您无法在iOs或Android设备上自动播放视频或任何其他流。这是您必须处理的安全限制: 媒体流音频或视频只能在触摸事件后启动。 如果您需要打开另一个流,则必须在加载/播放它之前触发另一个触摸事件。 最后,您一次只能加载/播放一个流。 只需在视频上方添加播放按钮即可触发video.play
//--- 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();