YouTube JavaScript API - 휴대 전화에서 Iframe을 만들지 않고도 동영상을 재생할 수 있습니까?

휴대 전화에서 동영상을 (id/url로) 실행하려면 YouTube JavaScript API에 옵션이 있습니까? 지금은 동영상 목록 (youtube api에서 PHP를 통해 다운로드 한 데이터)을 가지고 있으며 각 동영상의 썸네일을 제목/날짜/등 옆에 표시하고 있습니다.YouTube JavaScript API - 휴대 전화에서 Iframe을 만들지 않고도 동영상을 재생할 수 있습니까?

사용자가 미리보기 이미지를 탭했을 때 동영상을 재생하고 싶지만 JS API로 동영상의 iframe을 (오버레이로) 만들지 않고도이 작업을 수행하는 방법을 알아낼 수는 없지만 사용자는 API가 휴대 전화에서 자동 재생을 허용하지 않기 때문에 동영상을 재생하려면 다시 오버레이를 탭해야합니다.

누구든지 해결책을 알고 있습니까?

출처

2013-06-10 Joe

Android를 사용하는 경우 Android Player을 사용해야합니다. 다른 용도로는 IFrame Player을 사용해야합니다. Apple's own terms으로 인해 iOS에서 자동 재생이 작동하지 않습니다.

해결 방법을 찾았더라도 해당 조항을 위반하는 것이므로 권장하지 않습니다.

출처

2013-06-11 01:43:59

fiddle. 코드는 다음과 같습니다.

<div id="timerText"></div> 
<iframe id="player" width="420" height="315" src="http://www.youtube.com/embed/TP2iRzzamCk" frameborder="0" allowfullscreen></iframe> 

<body > 

<script> 
/** 
* @author  Rob W <[email protected]> 
* @website  http://stackoverflow.com/a/7513356/938089 
* @version  20120724 
* @description Executes function on a framed YouTube video (see website link) 
*    For a full list of possible functions, see: 
*    https://developers.google.com/youtube/js_api_reference 
* @param String frame_id The id of (the div containing) the frame 
* @param String func  Desired function to call, eg. "playVideo" 
*  (Function)  Function to call when the player is ready. 
* @param Array args  (optional) List of arguments to pass to function func*/ 
function callPlayer(frame_id, func, args) { 
    if (window.jQuery && frame_id instanceof jQuery) frame_id = frame_id.get(0).id; 
    var iframe = document.getElementById(frame_id); 
    if (iframe && iframe.tagName.toUpperCase() != 'IFRAME') { 
     iframe = iframe.getElementsByTagName('iframe')[0]; 
    } 

    // When the player is not ready yet, add the event to a queue 
    // Each frame_id is associated with an own queue. 
    // Each queue has three possible states: 
    // undefined = uninitialised/array = queue/0 = ready 
    if (!callPlayer.queue) callPlayer.queue = {}; 
    var queue = callPlayer.queue[frame_id], 
     domReady = document.readyState == 'complete'; 

    if (domReady && !iframe) { 
     // DOM is ready and iframe does not exist. Log a message 
     window.console && console.log('callPlayer: Frame not found; id=' + frame_id); 
     if (queue) clearInterval(queue.poller); 
    } else if (func === 'listening') { 
     // Sending the "listener" message to the frame, to request status updates 
     if (iframe && iframe.contentWindow) { 
      func = '{"event":"listening","id":' + JSON.stringify(''+frame_id) + '}'; 
      iframe.contentWindow.postMessage(func, '*'); 
     } 
    } else if (!domReady || iframe && (!iframe.contentWindow || queue && !queue.ready)) { 
     if (!queue) queue = callPlayer.queue[frame_id] = []; 
     queue.push([func, args]); 
     if (!('poller' in queue)) { 
      // keep polling until the document and frame is ready 
      queue.poller = setInterval(function() { 
       callPlayer(frame_id, 'listening'); 
      }, 250); 
      // Add a global "message" event listener, to catch status updates: 
      messageEvent(1, function runOnceReady(e) { 
       var tmp = JSON.parse(e.data); 
       if (tmp && tmp.id == frame_id && tmp.event == 'onReady') { 
        // YT Player says that they're ready, so mark the player as ready 
        clearInterval(queue.poller); 
        queue.ready = true; 
        messageEvent(0, runOnceReady); 
        // .. and release the queue: 
        while (tmp = queue.shift()) { 
         callPlayer(frame_id, tmp[0], tmp[1]); 
        } 
       } 
      }, false); 
     } 
    } else if (iframe && iframe.contentWindow) { 
     // When a function is supplied, just call it (like "onYouTubePlayerReady") 
     if (func.call) return func(); 
     // Frame exists, send message 
     iframe.contentWindow.postMessage(JSON.stringify({ 
      "event": "command", 
      "func": func, 
      "args": args || [], 
      "id": frame_id 
     }), "*"); 
    } 
    /* IE8 does not support addEventListener... */ 
    function messageEvent(add, listener) { 
     var w3 = add ? window.addEventListener : window.removeEventListener; 
     w3 ? 
      w3('message', listener, !1) 
     : 
      (add ? window.attachEvent : window.detachEvent)('onmessage', listener); 
    } 
} 
    var secs = 10; 
    var currentSeconds = 0; 
    var currentMinutes = 0; 
    setTimeout('Decrement()',1000); 

    function Decrement() { 
     currentMinutes = Math.floor(secs/60); 
     currentSeconds = secs % 60; 
     if(currentSeconds <= 9) currentSeconds = "0" + currentSeconds; 
     secs--; 
     document.getElementById("timerText").innerHTML = currentMinutes + ":" + currentSeconds; //Set the element id you need the time put into. 
     if(secs !== -1) { 
      setTimeout('Decrement()',1000); 
     }else{ 
      callPlayer('player', 'playVideo'); 
     } 
    } 
</script>

출처

2013-06-10 16:00:53

휴대 전화가 아닌 태블릿/데스크톱에서 작동합니다 (예 : iPhone). Android/Windows Phone에서 확인하지 않았습니다. – Joe

@Joe 글쎄, api는 플래시 플레이어가 설치된 플랫폼에 적합합니다 (모든 스마트 폰/태블릿을위한 것은 아닙니다). 어쨌든 iOS와 함께 API를 사용할 수는 있지만이 경우에는 맞지 않습니다. https://groups.google.com/forum/?fromgroups#!topic/youtube-api-gdata/YQecs6a5lzE를 신고하기 만하면됩니다. –

YouTube JavaScript API - 휴대 전화에서 Iframe을 만들지 않고도 동영상을 재생할 수 있습니까?

답변

관련 문제