Скрипт для зчитування інформації з аудіо-потоку

Сьогодні ми хотіли б розповісти вам про те, як можна отримати інформацію з аудіо-потоку. Однак для початку невелика передісторія. З незапам'ятних часів музика була одним з найбільш затребуваних видів мистецтва. Всі люблять слухати і насолоджуватися улюбленою музикою. Сьогодні ми хотіли б розповісти вам про щось безпосередньо пов'язаним з музикою. Як відомо, сьогодні в інтернеті можна знайти безліч радіостанцій, і буквально кожен з нас може без проблем створити власну радіостанцію. Інші люди, слухачі, можуть прослуховувати ці потоки інформації.

Найчастіше радіостанції представляють собою нескінченний потік інформації, що передається по двох найбільш поширеним протоколам: Shoutcast або Icecast (це інтернет-сервери мовлення). Деякий час назад нам потрібно було використовувати всевозможие flash-плеєри для того, щоб слухати ці станції, однак з приходом HTML5 ситуація значно змінилася. HTML5 представила нам новий елемент audio ', який дозволяє працювати з аудіо-потоками.

Ми можемо витягувати різну інформацію з цих потоків, будь то інформація про сервер, заголовки, опис, тип аудіо, бітрейт, кількість слухачів, жанр музики, ім'я виконавця поточної пісні, а також переглядати історію відтворених треків. Перед тим як перейти до роботи над кодом, хотілося б продемонструвати вам те, що у нас повинно вийти:

Скрипт для зчитування інформації з аудіо-потоку

Для початку, давайте розглянемо робочий процес з Icecast. Сервер Icecast пропонує всю статистику у файлі status.xsl. Отже, нам потрібно завантажити його, а потім пропарсіть для того, щоб отримати всю інформацію. Ми підготували наступний клас, який збирає цю інформацію (за допомогою CURL):


Сервер Shoutcast пропонує інформацію в інших файлах: index.html містить загальну інформацію про статус сервера, статус потоку, кількості слухачів, типі аудіо, жанрі і відтворюється пісні. Крім цієї інформації, сервер також пропонує інший файл, played.html, в якому міститься історія пісень (цей файл також дуже корисний). Ми вирішили відобразити всі доступні значення за допомогою foreach:

HTML-код досить простий:


Тут ми просто змушуємо форму отримувати параметри url і type і відобразити результати.

Нарешті, щоб результат вийшов більш привабливим, ми підготували такі стилі: