モバイルSafari：オーディオ+キャッシュマニフェスト

Question

私はいくつかのボタンをクリックすると実際に短いサウンドビットを再生する小さなウェブアプリケーションを持っています。 iOS（iPad）のモバイルSafariを明示的にターゲットにしています。

モバイルサファリでこのコンテキストでHTML5オーディオのいくつかの「欠点」について読んで、いくつかの「ハック」やトリックを試してみたところ、Safariが単純に思えるより良い単語）壊れた：

ボタンAのクリックでサウンドAを再生することができます（それは始めるのに時間がかかります - 私はそれは下りしていると思いますか？）その後、ボタンをクリックしますBは直ちに音Aを再び再生する。ボタンCと同じです。場合によっては、別のサウンド、時には正しいサウンドを再生することもあります。しかし、ほとんどがAです。使用されているフォーマットは.aiffで、現在.m4aです。

自分自身をいくつかの小さなバージョンを書いた後、私はFunnily十分..サウンドの読み込み/再生/などを扱うようにBuzz図書館で行くことに

を決め、彼らのデモはかなり正確に何がゲームを含みとが同じエラー動作を引き起こす必要があります。私は、タブ内のモバイルSafariのオーディオプレーヤーがBuzzデモゲーム（！）から特定のサウンドを再生する状況になってしまった。

キャッシュマニフェストがApplesのプリロード制限を克服し、オフラインモードでボタンを押した直後にサウンドを再生するようにすることができると期待していました。しかし、アプリケーション全体がキャッシュされていることを確認した後、私はオフラインモードでサウンドを再生/聞くことができません。

誰かが何とかこのようなことをすることができましたか？（ - Appleは、特定の物事を処理する方法を見た、私は」...しかし、多くの応答を期待しないでください）

---

アップデート1：この答えで

の例では、同じ効果が発生します。How to synthesize audio using HTML5/Javascript on iPad

---

アップデート2：

iOS（とSafari）をアップデートすると、オーディオのバグが解決されるようです。ただし、キャッシュマニフェストはオーディオファイルに影響を与えないようです。これらのファイルはまったく利用できません。

キャッシュマニフェストを削除した後、アプリは正常に機能しますが、それを「ホーム画面」に追加して再読み込みすると、オーディオが再生されなくなります。

Answer 1

すべてのhtml5メディアを完全に動作させる魔法の式があると言いたいのですが、そうではありません。 HTML5のオーディオ/ビデオのモバイルサポートは今はかなり貧弱です。そのデスクトップの前身よりもはるかに遅れています。さらに悪いことには、異なるプラットフォームのそれぞれが別々にそれを処理し、それらのほとんどは準最近のバージョンでのみサポートします。

ただし、モバイルSafariでメディアファイルが正しく動作するようにするためのヒントがいくつかあります。それらを説明するためには、いくつかの欠点を理解する必要があります。

---

1）あなたは、複数のオーディオ/ビデオファイル

をロードすることはできません。そのブラウザは一度に一つのファイルをロードするというのが私の経験をされて。 1つのファイルを再生する場合は、別のファイルを再生してから再生してください。もう一度ファイルをロードするだけです。そして、私は自分でそれを試していませんでしたが、私はキャッシュマニフェストがここであなたを助けるとは思わない。

私がしなければならなかったことは、すべてのオーディオファイルを1つの大きなオーディオファイルにまとめることでした。次に、どのオーディオトラックが要求されたかに応じて、再生位置を適切な開始位置に移動し、そのトラックを再生します。次に、現在の再生位置がトラックの最後に当たるかどうかを判断するために、setIntervalを使用して数ミリ秒ごとに再生を調べます。それができたら、私はそれを一時停止した。 Pluis、私はちょうど電話のCPUが多くの負荷の下にあって、ちょっと遅すぎてフィードをチェックした場合に備えて、各トラック間に数秒（2-3秒）をくれました。

2）することはできません自動再生オーディオ/ビデオファイル

Appleは彼らのHTML5メディアタグ技術にこれらのトラックのみをロードし、ユーザーのクリックイベントに応答してプレーすることを制限を建てました。そうすれば、ウェブサイトに行ったときに迷惑なトラックを自動的に再生することはできませんでした。

私はオーディオ/ビデオタグを使用していたときに、リッチメディア広告を作成しようとしていました。そこで、バナーをクリックして広告を展開すると、バナーのクリックイベントにオーディオ/トラックの読み込みが行われました。

小さなライトボックスのポップアップが表示され、音をオン/オフしたいかどうかをユーザーに確認することをお勧めします。ユーザーがサウンドをオンまたはオフにしても、そのポップアップボックスのクリックイベントにロード関数をアタッチできます。

個人的には、私はload（）関数を使用して多くの運がなかった。私はその機能を実行してオーディオをロードし、次に再生をクリックして、それを再びロードします。私はちょうどそれを正しくしなかったことがいつもあったかもしれないので、間違っていることを証明して、それを働かせてください。私はトラックに再生するように指示したので、ロードを開始し、setIntervalを使用して現在の再生時間がわずか数ミリ秒増加したかどうかを確認します。一度それがトラックを再生し始めたことに気づいたら、すぐにそれを一時停止します。

3）オーディオ/ビデオタグが唯一のiOS 4.0でサポートし、高さ

この周りを得るために何のトリックはありません。その事実だけ。

http://www.w3.org/wiki/HTML/Elements/video
http://dev.w3.org/html5/spec-author-view/video.html#media-elements

幸運を：

---

は、ここで私は、オーディオ/ビデオタグを開発していたとき時に助けていくつかのサイトです！