پخش صدا در وب

تا قبل از ارائه HTML 5 ، استاندارد خاصی برای پخش فایل های صوتی در صفحات وب وجود نداشت و طراحان وب برای پخش اینگونه فایل ها از پلاگین هایی مثل falsh player استفاده می کردند .HTML5 روش استانداردی را برای پخش فایل های صوتی با استفاده از عنصر <audio> فراهم کرده است.

 

پشتیبانی مرورگرها

مرورگرهای Internet Explorer 9+, Firefox, Opera, Chrome, Safari عنصر <audio> را پشتیبانی می کنند.

نکته: Internet Explorer 8 و نسخه های قدیمی تر آن، عنصر <audio> را پشتیبانی نمی کنند.

 

برای پخش یک فایل صوتی در HTML5 از تگ <audio> به صورت کد زیر استفاده کنید :

مشاهده نتیجه

 

نحوه عملکرد کد بالا :

ویژگی controls برای افزودن کنترل هایی مثل پخش (play) ، توقف (pause) و تنظیم صدا می باشد.

متن بین دو تگ <audio> و </audio> (. Your browser does not support the audio tag) فقط در مرورگرهایی که از عنصر <video> پشتیبانی نمی کنند نمایش داده می شود. 

تگ <audio> به شما اجازه می دهد که چند تگ <source> داشته باشید. تگ های <source> می تواند به فایل های صوتی مختلفی لینک شوند. مرورگر اولین فرمتی که قابلیت پخش آن را داشته باشد، برای کاربر پخش می کند.

مثال بالا از یک فایل Ogg استفاده کرده است و در مرورگرهای Firefox, Opera, Chrome کار می کند. برای اینکه فایل صوتی در IE و Safari و نسخه های قبلی Chrome نیز پخش شود، باید از فابل های MP3 استفاده کنید.

 

خصوصیت های تگ <audio>

Autoplay: در صورت وجود فایل صوتی به محض آماده شدن پخش می شود. مقداری که می گیرد: autoplay

Controls: دکمه های مختلف مثل play و ... را اضافه می کند. مقداری که می گیرد: controls

Loop: در صورت اتمام فایل صوتی دوباره از اول شروع به پخش می کند. مقداری که می گیرد: loop

Preload: کاری می کند که صدا در هنگام لود شدن صفحه، آماده پخش شود. مقداری که می گیرد: perload

Src: آدرس فایلی است که باید پخش شود. مقداری که می گیرد: یک url

فرمت های صدا و پشتیبانی مرورگرها

در حال حاضر 3 فرمت تحت پشتیبانی عنصر <audio> قرار دارد.

 

مرورگر	MP3	Wav	Ogg
Internet Explorer	YES	NO	NO
Chrome	YES	YES	YES
Firefox	YES	YES	YES
Safari	YES	YES	NO
Opera	YES	YES	YES

 

 

File Format	Media Type
MP3	audio/mpeg
Ogg	audio/ogg
Wav	audio/wav