HTML5オーディオ

HTML5オーディオとは



HTML5オーディオは、ウェブブラウザ上で音声を取り扱うための技術仕様の総称です。これにより、ウェブページ上で音声の再生、録音、加工、認識といった高度な音声処理が可能になります。従来のプラグインに頼ることなく、ブラウザの標準機能として提供されるため、より手軽に、そしてリッチなオーディオ体験をウェブサイトに組み込むことができるようになりました。

<audio>要素



<audio>要素は、HTML5で導入された、音声ファイルをウェブページ上で再生するための要素です。この要素を用いることで、音声ファイルへのパスを指定するだけで、ブラウザが自動的に音声の再生に必要なUIを提供します。対応している主要なブラウザは以下の通りです。

対応ブラウザ



パソコン

Edge
Google Chrome 32.0.1700.76
Internet Explorer 11.0
Mozilla Firefox 26.0
Opera 18.0.1284.68
Safari 5.1.7

モバイル

Chrome Lite
Blackberry Browser
Google Chrome for Android
Internet Explorer Mobile 9
Mobile Safari
Mozilla Firefox for Android
Opera Mobile
Tizen

対応音声コーデック



<audio>要素でサポートされている音声コーデックは、ブラウザによって異なりますが、一般的には以下のものがサポートされています。

MP3
AAC
Ogg Vorbis
WAV
Opus (2012年にロイヤリティーフリーでリリースされた新しいコーデックで、Mozilla、Google、Operaでサポートされています。WebRTCでも使用されます。)

Web Audio API



Web Audio APIは、W3Cによって開発されているJavaScript APIで、ウェブアプリケーションで高度な音声処理と音声合成を行うためのものです。このAPIでは、AudioNodeオブジェクトを連結することで、複雑な音声処理フローを構築することができます。音声の加工は主にブラウザ側で行われますが、JavaScriptを用いて直接処理することも可能です。

対応ブラウザ



パソコン

Google Chrome 10 (14から標準で有効)
Mozilla Firefox 23 (25から標準で有効)
Opera 15
Safari 6

モバイル

Google Chrome for Android 28 (29から標準で有効)
Mobile Safari 6
Mozilla Firefox 23 (25から標準で有効)
Tizen

MediaStream Processing API



MediaStream Processing APIもW3Cによって開発されており、音声だけでなく、より一般的なメディアストリーミングの処理に対応しています。このAPIは、HTML要素との同期や、音声・動画のキャプチャ、WebRTCのメディアストリームの操作などを可能にします。音声のミキシングや加工にも使用されます。

Web Speech API



Web Speech APIは、音声合成と音声認識の機能を提供するAPIです。このAPIを利用することで、キーボードやマウスに頼らない、音声による入出力インターフェースをウェブアプリケーションに実装することができます。

対応ブラウザ



音声合成

パソコン

Google Chrome 33
Mozilla Firefox 49
Microsoft Edge
Opera 21
Safari 7

モバイル

Google Chrome Android 33
Mozilla Firefox 61 (62からデフォルト設定で有効)
Microsoft Edge
iOS Safari 7.1
Android WebView 33

音声認識

パソコン

Google Chrome 25 (webkitベンダープレフィックスが必要、Webサーバー経由の提供でなければ使用不可)
Mozilla Firefox 44 (デフォルト設定では無効)

モバイル

Google Chrome Android (webkitベンダープレフィックスが必要、Webサーバー経由の提供でなければ使用不可)

外部リンク



HTML Standard 4.8.10 The audio element (WHATWG)
HTML Standard 日本語訳 4.8.10 audio要素
HTML5_audio_element'>HTML5 audio element - W3C
Web Audio API - W3C
MediaStream Processing API - W3C
Web Speech API - W3C

もう一度検索

【記事の利用について】

タイトルと記事文章は、記事のあるページにリンクを張っていただければ、無料で利用できます。
※画像は、利用できませんのでご注意ください。

【リンクついて】

リンクフリーです。