Как избежать ненужной буферизации в jPlayer
У меня есть jPlayer (HTML5 song player с помощью jquery), и он начинает воспроизводить песню из xx секунд песни.
но проблема в том, что сначала нужно буферизировать XX секунд, а затем начать играть, что является пустой тратой полосы пропускания. Почему он не начинает буферизацию с XX секунд?
вот код, который я использую:
$("#jquery_jplayer_1").jPlayer({
ready: function () {
$(this).jPlayer("setMedia", {
mp3: playList[0],
volume: CUR_VOL
}).jPlayer("play", 251);
},
swfPath: "js",
supplied: "mp3",
errorAlerts: false
});
редактировать
Я хотел получить ответ, чтобы избежать буферизации первых XX секунд.
1 ответов
это флэш-полифилл, который должен буферизировать. Старые браузеры, которые не поддерживают HTML5 <audio>
будет страдать от этой проблемы, где вместо этого используется jplayer flash fallback.
веб-сервер должен поддерживать поиск потока.
посмотреть это jPlayer Google Group вопрос о буферизации и поиск через потоковый MP3-файл с тегом HTML5 & https://groups.google.com/forum#!тема / jplayer / irSrmN0aUSU для обсуждения поиска и Принять-Диапазоны заголовки.
Edit: я немного покопался в этой проблеме... хотя мне жаль, что у меня все еще нет окончательного ответа.
во-первых,руководство по разработке jPlayer подробности проблемы с .mp3
файлы и заголовок Accept-Ranges. Если вы используете Chrome, вы можете увидеть Accept-Ranges request and response header - при нажатии кнопки F12 и выберите сеть tab. Нажав на .mp3
файл, вы можете проверить заголовки. Хорошая новость в том, что это действительно похоже на ваш сервер тут поддержка заголовка Accept-Ranges. Однако он по-прежнему не объясняет, почему иногда ему нужно сначала буферизировать загрузку.
Я думаю, вы должны начать с простой demo, без поддержки flash и одного .mp3
. Плейлист генерируется случайным образом, поэтому трудно определить, если проблема только для определенных файлов. Кроме того, я использовал инспектор jPlayer который может дать подробную статистику для jPlayer, которая может помочь диагностировать проблему.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Test</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script>
<script src="jQuery.jPlayer.2.0.0/jquery.jplayer.min.js" type="text/javascript"></script>
<script src="jQuery.jPlayer.2.0.0/jquery.jplayer.inspector.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
$('#jplayer').jPlayer({
ready: function () {
$(this).jPlayer('setMedia', {
mp3: 'mp3/example.mp3'
});
},
swfPath: 'not_a_valid_directory',
solution: 'html, flash',
supplied: 'mp3'
});
$('#jplayer_inspector').jPlayerInspector({jPlayer:$('#jplayer')});
$('#seeker').click(function() {
$('#jplayer').jPlayer('play', 20);
return false;
});
});
</script>
</head>
<body>
<div id="jplayer"></div>
<a href="#" id="seeker">Play 20s from start</a>
<div id="jplayer_inspector"></div>
</body>
</html>
вы также можете изменить код выше, в том числе:
swfPath: 'jQuery.jPlayer.2.0.0',
solution: 'flash, html',
в конструкторе jPlayer, чтобы заставить Flash быть игроком по умолчанию.