javascript - YouTube IFrame API 播放方法在触摸某些 Android 平板电脑之前不起作用

Question

我们正在开发 YouTube 播放器并使用 IFrame API。除了在我们的 Android 4.2.2 测试设备上，一切都运行良好。

只有在这些设备上(而不是在任何其他版本的 Android 上)，才需要通过触摸视频 View “手动”启动视频。在所有其他设备上，我们可以使用 YouTube 方法以编程方式开始播放视频。

一旦视频以这种方式启动，YouTube API 就会按预期工作(即播放、暂停、停止方法都按预期以编程方式工作)。

这是我们代码的本质:

var player;
function onYouTubeIframeAPIReady() {
  player = new YT.Player('player', {
    height: '390',
    width: '640',
    videoId: 'C0DPdy98e4c',
    playerVars: {
      controls: 0,
      showinfo: 0,
      modestbranding: 1
    }
  });
}

function playVideo() {
  player.playVideo();
}

如果我们尝试在用户“手动”启动视频(在 Android 4.2.2 设备上)之前以编程方式播放视频，视频将开始缓冲然后失败。失败后，视频 View 会变黑并显示不同的图案，如下图视频 View 的左上角所示:

有没有其他人遇到过这个问题？有人对此有何建议吗？

Answer 1

这是一个已知问题，您有两种可能的解决方案:

1) 如果您可以定位 API >= 17，您可以依赖新的 WebView 和新的 WebSettings api 方法 setMediaPlaybackRequiresUserGesture()

WebSettings settings = webview.getSettings();
settings.setMediaPlaybackRequiresUserGesture(false);

2) 如果您的目标 api < 17，那么您必须在正确的时间模拟用户在 WebView 上的点击(比如在加载页面之后和发送播放命令之前):

private void emulateClick(final WebView webview) {
    long delta = 100;
    long downTime = SystemClock.uptimeMillis();
    float x = webview.getLeft() + webview.getWidth()/2; //in the middle of the webview
    float y = webview.getTop() + webview.getHeight()/2;

    final MotionEvent motionEvent = MotionEvent.obtain( downTime, downTime + delta, MotionEvent.ACTION_DOWN, x, y, 0 );
    final MotionEvent motionEvent2 = MotionEvent.obtain( downTime + delta + 1, downTime + delta * 2, MotionEvent.ACTION_UP, x, y, 0 );

    Runnable tapdown = new Runnable() {
        @Override
        public void run() {
            if (webview != null) {
                webview.dispatchTouchEvent(motionEvent);
            }
        }
    };

    Runnable tapup = new Runnable() {
        @Override
        public void run() {
            if (webview != null) {
                webview.dispatchTouchEvent(motionEvent2);
            }
        }
    };

    int toWait = 0;
    int delay = 100;
    webview.postDelayed(tapdown, delay);
    delay += 100;
    webview.postDelayed(tapup, delay);
}