HTML5 menyediakan standar untuk memainkan file audio.
HTML5 Audio adalah subjek dari spesifikasi HTML5, menggabungkan input audio, pemutaran, dan sintesis, serta pidato teks, dalam browser.
Audio di Web
Sebelum HTML5, tidak ada standar untuk memainkan file audio pada halaman web.
Sebelum HTML5, file audio hanya bisa dimainkan dengan plug-in (like flash) .
HTML5 <audio> elemen menentukan cara standar untuk menanamkan audio dalam sebuah halaman web.
Dukungan Browser
Angka-angka dalam tabel menentukan versi browser pertama yang mendukung penuh <audio> elemen.
| Elemen | |||||
|---|---|---|---|---|---|
| <audio> | 4.0 | 9.0 | 3,5 | 4.0 | 10.5 |
HTML <audio> Elemen
Untuk memutar file audio dalam HTML, gunakan <audio> elemen:
Contoh
<audio controls>
<source src="horse.ogg" type="audio/ogg">
<source src="horse.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio> Cobalah sendiri " The <audio yang> elemen mewakili suara, atau streaming audio. Hal ini umumnya digunakan untuk memutar ulang file audio tunggal dalam sebuah halaman web, menampilkan widget GUI dengan kontrol play / pause / volume.
The <audio yang> elemen memiliki atribut ini:
atribut global (accesskey; kelas; contenteditable; ContextMenu; dir; draggable; dropzone; tersembunyi; id; lang; spellcheck; gaya; tabindex; judul; menerjemahkan)
autoplay = "autoplay" atau "" (string kosong) atau kosong Menginstruksikan User-Agent untuk secara otomatis memulai pemutaran dari stream audio secepat itu dapat melakukannya tanpa berhenti.
preload = "none" atau "metadata" atau "auto" atau "" (string kosong) atau kosong Merupakan sebuah petunjuk untuk User-Agent tentang apakah download optimis dari stream audio itu sendiri atau metadata yang dianggap berharga.
"None": Petunjuk untuk User-Agent bahwa pengguna tidak diharapkan untuk memerlukan stream audio, atau yang meminimalkan lalu lintas yang tidak perlu yang diinginkan.
"Metadata": Petunjuk untuk User-Agent bahwa pengguna tidak diharapkan untuk membutuhkan aliran audio, tapi itu mengambil metadata nya (durasi dan sebagainya) yang diinginkan.
"Auto": Petunjuk untuk User-Agent yang optimis men-download seluruh stream audio dianggap diinginkan.
kontrol = "kontrol" atau "" (string kosong) atau kosong Menginstruksikan User-Agent untuk mengekspos antarmuka pengguna untuk mengontrol pemutaran audio stream.
lingkaran = "loop" atau "" (string kosong) atau kosong Menginstruksikan User-Agent untuk mencari kembali ke awal dari stream audio setelah mencapai akhir. mediagroup = string Menginstruksikan User-Agent untuk menghubungkan beberapa video dan / atau audio stream bersama-sama.
diredam = "diredam" atau "" (string kosong) atau kosong Merupakan keadaan default dari aliran audio, berpotensi mengesampingkan preferensi pengguna. src = non-kosong [URL] berpotensi dikelilingi oleh ruang URL untuk streaming audio.
HTML Audio - Cara Bekerja
The controls atribut menambahkan kontrol audio, seperti play, pause, dan volume.
Teks antara <audio> dan </audio> tag akan ditampilkan dalam browser yang tidak mendukung <audio> elemen.
Beberapa <source> elemen dapat link ke file audio yang berbeda. browser akan menggunakan format diakui pertama.
HTML Audio - Dukungan Browser
Saat ini, ada 3 format file yang didukung untuk <audio> elemen: MP3, Wav, dan Ogg:
| Browser | MP3 | wav | Ogg |
|---|---|---|---|
| Internet Explorer | YES | NO | NO |
| Chrome | YES | YES | YES |
| Firefox | YES | YES | YES |
| Safari | YES | YES | NO |
| Opera | YES | YES | YES |
HTML Audio - Jenis Media
| File Format | Tipe media |
|---|---|
| MP3 | audio/mpeg |
| Ogg | audio/ogg |
| Wav | audio/wav |
HTML Audio - Metode, Properties, dan Acara
HTML5 mendefinisikan metode DOM, sifat, dan acara untuk <audio> elemen.
Hal ini memungkinkan Anda untuk memuat, bermain, dan jeda audio, serta durasi set dan volume.
Ada juga DOM peristiwa yang dapat memberitahu Anda ketika audio mulai bermain, dijeda, dll
Untuk referensi DOM penuh, pergi ke kami HTML5 Audio / Video DOM Reference .
HTML5 Tags Audio
| Menandai | Deskripsi |
|---|---|
| <audio> | Mendefinisikan konten suara |
| <source> | Mendefinisikan sumber daya media beberapa untuk elemen media, seperti <video> dan <audio> |
HTML Audio - Web Speech API
Web Speech API bertujuan untuk memberikan metode input alternatif untuk aplikasi web (tanpa menggunakan keyboard). Dengan API ini, pengembang dapat memberikan web apps kemampuan untuk menuliskan suara ke teks, dari mikrofon komputer. audio yang direkam dikirim ke server pidato untuk transkripsi, setelah teks diketik untuk pengguna. API sendiri adalah agnostik dari pelaksanaan pengenalan suara yang mendasari dan dapat mendukung server berbasis serta tertanam recognizers. Kelompok HTML Speech Incubator telah mengusulkan penerapan teknologi audio-speech di browser dalam bentuk seragam, cross-platform API. API berisi:
- Pidato Masukan API
- Text to Speech API