web-dev-qa-db-ja.com

モバイルサファリでの音声の自動再生

私が死ぬまで燃え上がる前に、オーディオファイルを自動的にダウンロードするというユーザーへの恐ろしいコストに対するAppleの懸念のために、これは現在うまくいかないことを知っています（彼らがWebアプリを取得できないため、彼らがWebアプリを不自由にしようとすることとは関係ありません）それらから30％）。

しかし、私の質問は次のとおりです。誰かがまだずる賢い回避策を見つけましたか？ゲームの起動時に起動音を再生したいだけですが、オーディオを再生する前に、ユーザーがどこかをクリックするのを待つ必要があります。あなたの1人は、これまでにこれを機能させているに違いありませんか？

htmlaudiomobile-safariautoplay
16
Simple Simon

モバイルブラウザーで自動再生を機能させる機会はありません。 AndroidおよびiOSでは許可されておらず、個人的にはそれが実現可能な監禁だと思います！毎秒2つ目のWebサイトでプレイを開いて醜いサウンドを開始すると想像してください！

しかし、少しハックして、ユーザーが現在アプリケーションのオーディオを開始したことをユーザーが気付かないようにすることができます。

  1. オーディオを開始するには、ユーザーの操作が必要です。したがって、アプリやゲームには、スタート画面またはウェルカムボタンがあり、クリックしてメインメニューに移動したりゲームを開始したりする必要があります。ユーザーイベントにバインドし（受け入れられるイベントは「クリック」、「タッチエンド」、「ダブルクリック」、「キーダウン」）、<audio>のload（）メソッドを呼び出します。

  2. <audio>の「canplaythrough」イベントにバインドします。このイベントは、ソースを再生する準備ができるとトリガーされます。ここで、play（）、pause（）を呼び出したり、他の相互作用を待つことができます。これでオーディオは準備できましたが、いつサウンドを開始または停止するかを完全に制御できます。

  3. モバイルクライアントでオーディオスプライトを使用することもお勧めします。 iOS（およびAndroid？）は、シングルトンを介して内部的に実装されたオーディオサポート。つまり、デスクトップブラウザーのように、10のオーディオ要素を使用して異なるサウンドを一度に再生することはできません。再生できるファイルは1つだけです！したがって、さまざまなサウンドのソースを変更するには、かなりの時間がかかります。オーディオスプライトを使用すると、ユーザーが最初にWebサイトまたはゲームを操作するときにスプライトを開始できます。 Spriteを一時停止し、サウンドを再生する必要がある場合は、currentTimeをSpriteの先頭に設定し、ファイルのcurrentTimeがSpriteの末尾に達したときにSpriteを一時停止する必要があります。スプライトのcurrentTimeを確認できるtimeupdateイベントがあります。

もっと興味があれば、JavaScriptオーディオスプライトプレーヤーを準備します。

14
Simon Franzen

これまでに見た唯一の解決策は、シェルアプリを作成し、WebアプリをUIWebView内に配置することです。

http://flowz.com/2011/03/Apple-disabled-audiovideo-playback-in-html5/

UIWebView.allowsInlineMediaPlayback = YES;
UIWebView.mediaPlaybackRequiresUserAction = NO;

また、私は昔ながらのWebアプリでこれを行う方法を本当に知りたいと思っています。

4
Jason

私は自分のアプリでこれを解決したと思います。

ステップ、

コントローラがロードされ、

次に... viewDidLoadで

webビューにHTMLをロードさせる：loadHTMLString：htmlFile baseURL：[self getBasePath]];

次に、webviewでmediaPlaybackRequiresUserAction = NOを設定します。

設定が早すぎると、htmlのロードによってリセットされると思います。

0
user3799852

ボイスメッセージを含むボットチャットアプリがあり、必要なときにいつでも自動再生する必要がありました...なので、angular app：

ドキュメントにクリックイベントリスナーを添付してplayer.load()を呼び出すだけです。その後、player.src = x;を設定すると、自動再生されます。

<audio id="voicePlayer" controls autoplay playsinline #voicePlayer></audio>

@ViewChild('voicePlayer', { read: ViewContainerRef }) voicePlayerRef: ViewContainerRef;

...

  ngAfterContentInit(): void {
    this.voicePlayer = this.voicePlayerRef.element.nativeElement;
    document.addEventListener('click', this._onDocumentClick.bind(this));
  }

  _onDocumentClick() {
    this.voicePlayer.load();
    document.removeEventListener('click', this._onDocumentClick);
  }

...


this.voicePlayer.src = 'x';
0
Exlord