最近在做移动端的项目时遇到,audio和video中的媒体文件的currentTime失效进而无法快进。
复现方法: 使用chrome在本地局域网如: http://192.168.1.104:8020/index.html打开 或者 在公司的服务器上打开页面时会出现这种情况
但直接双击index.html打开和localhost下面打开是可以快进的,使用火狐和IE任何时候都是表现正常的
这种情况很有可能是你使用了 php asp jsp 等脚本来动态输出媒体文件内容。
如果通过PHP/asp/jsp等脚本语言动态输出流媒体内容,导致chrome下的currentTime不会生效,需要直接链接 .mp3 .mp4等格式文件才能支持使用 currentTime 调整播放进度。使用格式 audio | vidio .currentTime = n;
其中 n 代表起始播放的秒数。
可以通过X-SendFile来解决脚本输出内容让currentTime失效的问题,以Apache服务器为例。
首先下载mod_xsendfile,将模块文件复制到Apache的modules目录,在Apache配置文件中添加
LoadModule xsendfile_module modules/mod_xsendfile.so
XSendFile On
XSendFilePath D:/Gallery/Media/Audio/S.H.E
其中XSendFilePath意思是将指定的文件夹路径添加到白名单中,允许文件下载。重启Apache服务器
安装了X-SendFile模块以后,PHP输出媒体文件变得非常简单。
<?php
header('Content-Type: audio/mp3');
header('X-Sendfile: D:/Gallery/Media/Audio/S.H.E/612xq.mp3');
?>