HTML5 Audio Player делает несколько запросов GET при загрузке.Зачем? - PullRequest
11 голосов
/ 17 августа 2010

Я работал над плагином jquery, который использует аудиоплеер HTML5 () для воспроизведения mp3. Я заметил, что в разных браузерах при загрузке аудиоплеера было сделано несколько запросов GET для одного и того же файла MP3.

Я создал простой автономный HTML-файл, чтобы проверить это.

<html>
<head></head>

<body>
    <audio controls src="http://localhost:5000/files/one.mp3" type="audio/mp3"></audio>
<body>  
<html>

При открытии страницы в OS X Safari 5.0.1 я видел следующие журналы с моего веб-сервера (3 запроса GET):

>> Thin web server (v1.2.7 codename No Hup)
>> Maximum connections set to 1024
>> Listening on 0.0.0.0:5000, CTRL+C to stop
127.0.0.1 - - [17/Aug/2010 11:09:32] "GET /one.mp3 HTTP/1.1" 200 4030432
0.0022
127.0.0.1 - - [17/Aug/2010 11:09:32] "GET /one.mp3 HTTP/1.1" 200 4030432
0.0012
127.0.0.1 - - [17/Aug/2010 11:09:32] "GET /one.mp3 HTTP/1.1" 200 4030432
0.0010

Обратите внимание, что запросы относятся к "GET /one.mp3", а не к "GET /files/one.mp3", потому что мой Тонкий веб-сервер работает с префиксом /files.

.

При открытии того же HTML-файла в OS X Chrome я видел 2 запроса GET для /one.mp3.

При открытии того же HTML-файла в OS X Opera я увидел 1 GET-запрос на /one.mp3.

В чем причина нескольких запросов GET для одного файла? Пропускная способность на моем сервере ограничена, и я регулирую соединения со скоростью 75 КБ / с (это HTTP-соединение, а не пользовательское). Меня беспокоит, что если Safari установит 3 HTTP-соединения для загрузки (потокового воспроизведения) одного mp3-файла, это сократит количество одновременных пользователей, которые могут обрабатывать мой сервер.

Это то, что меня должно беспокоить с точки зрения производительности / пропускной способности? Кроме того, мне любопытно, почему некоторые браузеры делают несколько запросов на один и тот же файл, а другие нет.

Ответы [ 2 ]

7 голосов
/ 04 февраля 2012

В случае Firefox, три запроса сделаны для аудио.Это делается для поддержки областей воспроизведения и поиска медиафайлов, которые еще не загружены.По сути, это загрузка файла и определение его продолжительности в трех частях.В качестве объяснения было приведено следующее, когда это поведение сообщалось в Mozilla как ошибка :

  1. Первый GET считывает первый фрагмент файла ogg.Исходя из этого, мы можем убедиться, что это действительный ogg и т. Д. Загруженные данные должны быть кэшированы Firefox.
  2. Второй GET: К сожалению, файлы Ogg не содержат их длительности, поэтому мы прекращаем первоначальную загрузку и ищемв конец файла Ogg и прочитайте немного данных, чтобы извлечь длительность медиа.
  3. Третий GET: После того, как мы выяснили продолжительность медиа, мы возобновим загрузкусредства массовой информации.Нам не нужно повторно загружать данные, которые уже кэшированы, поэтому мы возобновляем работу с того места, где предыдущая загрузка была остановлена.

Хотя это объяснение применимо только к Firefox, вы можете предположить, что подобные методы используются webkitбраузеры также.

Не думаю, что вас должно беспокоить, что это повлияет на количество одновременно работающих пользователей.Если в журналах вашего сервера указана временная метка в миллисекундах, вы увидите, что три запроса срабатывают последовательно и каждый запрос отменяется до выполнения следующего запроса.

7 голосов
/ 15 сентября 2010

Возможно ли, что Safari делает дополнительные запросы для получения метаданных?Попробуйте разные значения атрибута preload, чтобы увидеть, имеет ли он какое-либо значение:

  • preload = "none" - данные не загружаются заранее (не должно быть никаких GET)
  • preload =«метаданные» - базовые метаданные, такие как длительность, битрейт, частота дискретизации и т. д., предварительно выбраны (должен отображаться один GET)
  • preload = «auto» - весь файл предварительно выбран (может отображаться несколько GET)

См. http://dev.w3.org/html5/spec/Overview.html#attr-media-preload для полного описания этого атрибута.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...