Mobile Safari で Audioを再生する方法は大きく、Audioタグ をつかう方法と Web Audio API をつかう方法があります。
2つの方法には微妙な違いがあって、いままでもちょいちょい検証してきたんですが、ここらで1つの記事にまとめておこうと思います。
※ 検証はiOS8.4のiPhone6で行いました。
再生に関する挙動
Audioタグ
- タップ等のユーザーの動作が必要
Web Audio API
- タップ等のユーザーの動作が必要
音量に関する挙動
Audioタグ
- iPhone本体のボリュームでのみ制御可能(APIからの操作は無視)
Web Audio API
- iPhone本体のボリューム、APIどちらからでも制御可能
サイレントモードに関する挙動
Audioタグ
- 本体音量が0でない限りサイレントモードでも音が出る
コントロールセンターでの操作
Audioタグ
- 一時停止 / 再生 / ボリュームの制御が可能
- Safariを終了するか、標準ミュージックアプリで音を再生するなどしてコントロールできる音源を上書きするまで保持される模様
- 複数のAudioタグを再生した場合にコントロールできるAudioタグが謎(検証中)
Web Audio API
- 制御不可
別タブに遷移した際の挙動
Audioタグ
- 再生し続ける
- ただし他のタブでAudoiタグを再生すると止まる(同時に複数のAudioタグは再生できない)
- Safariを終了しない限り再生位置を覚えている模様
- 他のタブでWebAudioAPIを再生した場合は止まらず流れつづける
Web Audio API
- 音量がフェードアウトしながら0になり一時停止する
- ページに戻ってくると再生を再開しながらフェードインする
ホームボタンを押しSafariを裏にまわした際の挙動
Audioタグ
- 再生し続ける
- コントロールセンターで一時停止 / 再生 / ボリュームの操作が可能
- 標準のミュージックアプリなどで音を出した際に一時停止する
- Safariを終了しない限り再生位置を覚えている模様
Web Audio API
- 音量がフェードアウトしながら0になり一時停止する
- ページに戻ってくると再生を再開しながらフェードインする
スリープボタンを押した際の挙動
Audioタグ
- 再生し続ける
- コントロールセンターで一時停止 / 再生 / ボリュームの操作が可能
Web Audio API
- 音量がフェードアウトしながら0になり一時停止する
- ページに戻ってくると再生を再開しながらフェードインする
ホームボタンを2度押ししSafariを終了したときの挙動
Audioタグ
- 停止
- コントロールセンターからも破棄される
Web Audio API
- 停止