HTML5 audio ,在chrome中设置currentTime无效

Question

打算用audio自己做个播放器，需要用audio标签的currentTime属性，来控制播放进度。但是这个属性在FireFox及ie11下都有效，但就是在chrome下面，设置了无效，不知道各位大神知道原因吗？
代码如下：
.directive('mediaPlayer',function(mediaPlayerConfig,$interval,$timeout){
return{
restrict:'EA',
templateUrl:'template/player.html',
scope:{
playList:'='
},
controller:function($scope){
varplayer=this;
varconf=mediaPlayerConfig;
varplayList=$scope.playList||[];
var$audio,isPlaying=false;
vartimer=null;
varindex=0;
varaudioLike={
currentTime:0,
duration:0,
volume:0
};
player.initialize=function(){
$scope.audioLike=audioLike;
audioLike.volume=$audio.volume;
player.play(index)
};
player.setAudio=function(element){
$audio=element[0];
player._bindEvents(element);
};
player.play=function(file){
varidx;
if(angular.isNumber(file)){
idx=file;
file=playList[idx];
}
if(file){
$audio.src=file[conf.fileUrlProp];
$scope.currentFile=file;
}
$interval.cancel(timer);
timer=$interval(function(){
audioLike.currentTime=$audio.currentTime.toFixed(0);
},1000);
$audio.play();
isPlaying=true;
};
player.pause=function(){
$audio.pause();
isPlaying=false;
$interval.cancel(timer);
};
//播放上一首，如果已经是第一首，则跳到最后一首
player.prev=function(){
index=index===0?
playList.length-1:
index-1;
player.play(index);
};
//播放下一首，如果已经是最后一首，则跳到第一首
player.next=function(){
index=index===(playList.length-1)?
0:
index+1;
player.play(index);
};
player.skipTo=function(sec){
$audio.currentTime=sec;
};
player.togglePlay=function(){
varmethod=isPlaying?'pause':'play';
player[method]();
};
player.isPlay=function(){
returnisPlaying;
};
player.random=function(){
varmin=0;
varmax=playList.length-1;
varrange=max-min;
varrand=Math.random();
rand=min+Math.round(rand*range);
player.play(rand);
};
player._bindEvents=function(element){
element
.on('canplay',function(e){
$scope.$apply(function(){
audioLike.duration=$audio.duration.toFixed(0);
});
})
.on('ended',function(){
//如果允许循环
if(conf.loop){
}
if(conf.random){
player.random();
return;
}
$scope.$apply(function(){
player.next();
});
})
.on('progress',function(e){
console.log(e);
});
};
player.volume=function(volume){
if(angular.isNumber(volume)){
$audio.volume=volume;
}else{
return$audio.volume;
}
};
},
link:function(scope,element,attr,mediaPlayerCtrl){
mediaPlayerCtrl.initialize();
scope.skipTo=function(){
mediaPlayerCtrl.skipTo(250);
};
}
}
})

Answer 1

刚正好遇到这个问题，错误发生在idea自带server在播放本地音频，soundmanagersetPosition时自动归零。经验证是和responseheader有关的。我通过对MP3资源set不同的responseheader来验证，结果如下(貌似segmentfault不支持markdown的表格，所以下面排版有点乱。)：ieContent-Type必须，当我设为audio/mpeg时才能播放，设为application/octet-stream不能。Content-Length必须。和Accept-Ranges无关。chromeContent-Type无关，设为application/octet-stream可以播放。Content-Length，Accept-Ranges必须都有才可更改currentTime。也就是说ie需要responseheader有正确的Content-Type，Content-Length。chrome需要头部有Content-Length和Accept-Ranges。（Firefox没测）还有，MDN上的ConfiguringserversforOggmedia中有更详细的描述：HandleHTTP1.1byterangerequestscorrectlyInordertosupportseekingandplayingbackregionsofthemediathataren'tyetdownloaded,GeckousesHTTP1.1byte-rangerequeststoretrievethemediafromtheseektargetposition.Inaddition,Geckousesbyte-rangerequeststoseektotheendofthemedia(assumingyouservetheContent-Lengthheader)inordertodeterminethedurationofthemedia.YourservershouldaccepttheAccept-Ranges:bytesHTTPheaderifitcanacceptbyte-rangerequests.Itmustreturn206:Partialcontenttoallbyterangerequests;otherwise,browserscan'tbesureyouactuallysupportbyterangerequests.Yourservermustalsoreturn"206:PartialContent"fortherequest"Range:bytes=0-"aswell....以上，第一次在segmentfault回答问题，如有错漏，欢迎指正。