1. ホーム
  2. jquery

[解決済み] iPadでHTML5動画を自動再生できますか?

2022-08-05 07:47:12

質問

質問 <video> タグ autoplay="autoplay" 属性はSafariでは問題なく動作します。

iPad でテストする場合、動画は手動でアクティブにする必要があります。

読み込みの問題だと思ったので、メディアの状態をチェックするループを実行しました。

videoPlay: function(){
    var me = this;
    console.log('STATE: ' + $("#periscopevideo").get(0).readyState);
    if ($("#periscopevideo").get(0).readyState != 4){
      setTimeout(function(){me.videoPlay();}, 300);
    }
    else {
      $("#periscopevideo").get(0).play();
    }
}

での状態のままです。 0 のままです。デスクトップのサファリでは 0 , 1 そして最後に 4 . iPad では 4 を手動でタップした場合のみです。

さらに $("#periscopevideo").get(0).play() をクリックすると onClick も動作します。

自動再生に関して、アップル社から何か制約があるのでしょうか?(ちなみにiOS5+を使用しています)。

解決方法を教えてください。

iOS 10のアップデート

iOS 10 から自動再生が解禁されました - ただし、いくつかの制限があります (例: オーディオ トラックがない場合は A が自動再生される)。

これらの制限の完全なリストを見るには、公式ドキュメントを参照してください。 https://webkit.org/blog/6784/new-video-policies-for-ios/

iOS 9 およびそれ以前

iOS 6.1時点のものです。 では、iPad 上でビデオを自動再生することはできなくなりました。

私の推測では、なぜ自動再生機能を無効にしたのでしょうか?

多くのデバイス所有者がデバイスのデータ使用量や帯域幅を制限しているため、Apple は、帯域幅の使用を開始するタイミングをユーザー自身が決定すべきだと考えたのだと思います。


少し調査した後、iOS デバイスの自動再生に関して、Apple のドキュメントで以下の抜粋を見つけ、私の推測を確認しました。

Apple は、スクリプトと属性の両方の実装を通じて、iOS デバイスでのビデオの自動再生を無効にすることを決定しました。 を無効にすることを決定しました。

Safari では、iOS (iPad を含むすべてのデバイス) で、ユーザーが携帯電話ネットワークを使用していてデータ単位で課金される可能性がある場合、プリロードおよび自動再生が無効になります。 自動再生は無効です。 ユーザーが開始するまで、データは読み込まれません。 Apple のドキュメントです。

に掲載されている別の警告を紹介します。 Safari HTML5 リファレンス ページ に、iOS の Safari で埋め込みメディアが再生できない理由についての説明があります。

警告 : 携帯電話ネットワークを介した迷惑なダウンロードを防止するため、埋め込みメディアは iOSのSafariでは、埋め込みメディアを自動的に再生することはできません。 iOSのSafariでは、埋め込みメディアを自動的に再生することはできず、常にユーザーが再生を開始します。コントローラーは iPhoneやiPod touchでは、再生が開始されると自動的にコントローラーが供給されます。 しかし、iPad では、controls 属性を設定するか、JavaScript を使用してコントローラを提供する必要があります。 JavaScriptでコントローラを提供する必要があります。


これが意味するところは(コード的には)、Javascriptの play()load() メソッドは、ユーザが再生を開始するまで非アクティブです。 でない限り play() または load() メソッドは、ユーザーアクション(クリックイベントなど)によって起動されます。

基本的に、ユーザが起動した再生ボタンは動作しますが an onLoad="play()" イベントは動作しません。

例えば、これはムービーを再生します。

<input type="button" value="Play" onclick="document.myMovie.play()">

一方、iOSでは以下のようにしても何も起こりません。

<body onload="document.myMovie.play()">