web-dev-qa-db-ja.com

uiwebview iOSでYouTubeビデオイベント（開始、終了など）を処理する方法

現在、新しいiframe APIを使用してiPadのuiwebview内にYouTubeビデオを埋め込み、ユーザーの操作なしで自動再生することができました。 iframe APIでは、onstatechangeイベントの使用方法が説明されていますが、私のアプリケーションでは機能していないようで、残念ながらuiwebviewにデバッグが表示されません。

ビデオがいつ終了するかを検出できるようにしたいのですが、何かアドバイスはありますか？誰かがそれを機能させましたか？

ioseventsiframeuiwebviewyoutube
20
Pierpaolo

（ドキュメントから）映画の終了イベントに整数を割り当てようとしましたか？：

onStateChangeこのイベントは、プレーヤーの状態が変化するたびに発生します。 APIがイベントリスナー関数に渡すイベントオブジェクトのデータプロパティは、新しいプレーヤーの状態に対応する整数を指定します。可能なデータ値は次のとおりです。

-1 (unstarted)
0 (ended)
1 (playing)
2 (paused)
3 (buffering)
5 (video cued).

プレーヤーが最初にビデオをロードすると、開始されていない（-1）イベントがブロードキャストされます。ビデオがキューに入れられて再生の準備ができると、プレーヤーはビデオキュー（5）イベントをブロードキャストします。コードでは、整数値を指定するか、次の名前空間変数のいずれかを使用できます。

YT.PlayerState.ENDED
YT.PlayerState.PLAYING
YT.PlayerState.PAUSED
YT.PlayerState.BUFFERING
YT.PlayerState.CUED

だから、次のようなもの：

if(event.data==YT.PlayerState.ENDED){ 
//do stuff here
                }
15
CodaFi

これが http://code.google.com/apis/youtube/js_api_reference.html#SubscribingEvents あなたを助けることができます

1
Elegant Microweb

ビデオがいつ終了するかを検出するために、ビデオの状態は0またはYT.PlayerState.ENDEDになります。

これがjsfiddleへのリンクです リンク ！

<!DOCTYPE html>
<html>

  <head>
    <meta charset="UTF-8">
    <title>Page 1</title>
  </head>

  <body>

    <h1>Video page</h1>
    <br>


    <!-- 1. The <iframe> (and video player) will replace this <div> tag. -->
    <div id="player"></div>

    <script>
      // 2. This code loads the IFrame Player API code asynchronously.
      var tag = document.createElement('script');

      tag.src = "https://www.youtube.com/iframe_api";
      var firstScriptTag = document.getElementsByTagName('script')[0];
      firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

      // 3. This function creates an <iframe> (and YouTube player)
      //    after the API code downloads.
      var player;

      function onYouTubeIframeAPIReady() {
        player = new YT.Player('player', {
          height: '390',
          width: '640',
          videoId: 'ussCHoQttyQ',
          playerVars: {
            'autoplay': 0,
            'controls': 0,
            'showinfo': 0,
            'rel': 0
          },
          events: {
            'onReady': onPlayerReady,
            'onStateChange': onPlayerStateChange
          }
        });
      }

      // 4. The API will call this function when the video player is ready.
      function onPlayerReady(event) {
        event.target.playVideo();
      }

      // 5. The API calls this function when the player's state changes.
      // The function indicates that when playing a video (state=1),
      // -1 unstarted 
      // 0 ended 
      // 1 playing
      // 2 paused
      // 3 buffering
      // 5 video cued
      var done = false;

      function onPlayerStateChange(event) {
        console.log(event);
        if (event.data == YT.PlayerState.ENDED) {
          alert(1);
        }
      }

    </script>




  </body>

</html>
0
Gth lala

ブラウザのautoplay-policyに接続されている可能性があります（モバイルブラウザではデフォルトで無効になっています）。

ブラウザがchromeの場合、追加のコマンドラインフラグで起動できます--autoplay-policy=no-user-gesture-required-それは私のために働いた。

0
Vaksus