1

車両のインダッシュ ディスプレイ ユニット アプリをブラウザに移植しています。大きな目標は、Mobile Safari 内で完全に実行できるようにすることです。

これは HTML5/JS 音楽アプリであり、jQuery.load に大きく依存して、ページ フラグメントを読み込むことで異なる「画面」間を移動します。

問題は、ユーザーが再生するトラックを選択すると、トラックの再生を開始する必要がある「再生中」画面が表示されることです。この画面に到達すると、トラックは再生されません。オーディオの再生を開始するには、ユーザーがこの画面から明示的に再生をクリックする必要があります。これが初めて発生すると、自動再生はアプリの期間中機能します。

Mobile Safari は、ユーザー入力に直接応答しない限り、Web アプリがデータを消費しないように、オーディオの自動再生を防ぐために意図的にブロッカーを配置していることを理解しています。

問題は、私のオーディオ再生はユーザー入力に直接反応するということです...一種の. ただし、再生が実際に開始される前に、多くのことが発生する必要があり、それらのことが現在再生中のページ内で発生します (再生するトラックの URL を取得する API を呼び出し、ユーザーがトラックを再生していることを報告し、トラックのメタデータを取得し、yatta yatta yatta) .

これを回避するために、アプリの起動時にサイレント .1s mp3 ファイルをオーディオ要素にプリロードします。次に、再生中の画面に遷移するためのクリック イベントに直接応答して、オーディオ要素で .play() を呼び出します。

ユーザー入力に直接応答して .play を呼び出すと、現在再生中のページ内で .play() への後続の呼び出しが機能すると想定しました。これは以前に観察した動作です。

ただ、違いはないようでした。

現在再生中の画面をロードした後にオーディオ再生を開始するためにフローを調整する方法についてのアイデアはありますか?

編集:以下にいくつかのコードスニペットを追加しました

Vehicle.audio = {
        init: function () {
            audioElement.setAttribute("src", "/audioinit.mp3");
            audioElement.play();
        },

        play: function (source) {
            log("VEHICLE: playing audio from source " + source);

            Vehicle.audio.stop();
            audioElement.setAttribute("src", source);
            audioElement.play();
        },

ユーザーがトラックを選択すると、次のようになります。

$(document).on("click", "a.play-track", function () {
    Vehicle.audio.init();
    /* my wrapper function for jQuery.load() */
    replace_wrap("nowplaying.html");
});

次に、再生中のページで Vehicle.audio.play() が呼び出されます。

4

2 に答える 2

0

問題は、私のオーディオ再生はユーザー入力に直接反応するということです...一種の. ただし、再生が実際に開始される前に、多くのことが発生する必要があり、それらのことが現在再生中のページ内で発生します (API を呼び出して、再生するトラックの URL を取得し、ユーザーがトラックを再生していることを報告し、トラックのメタデータを取得し、yatta yatta yatta) .

「現在再生中のページ」全体に「touchstart」イベントリスナーを追加してみてください。これ.play()により、オーディオ要素が同期的に呼び出されます。

$(document).one("touchstart", function () {
  Vehicle.audio.init()
})

このようにして、iOS ユーザーが現在再生中のページのどこかに触れるとすぐに、オーディオの読み込み/再生が開始されます。

于 2016-05-31T19:08:14.697 に答える
-1

私の知る限り、これは iOS によって意図的に課された制限です。スクリプトが再生を開始できるようになる前に、ユーザーはデバイスを操作する必要があります (タッチ/クリック イベント)。

于 2016-05-31T18:18:30.390 に答える