android webview youtube嵌入视频自动播放无法正常工作

问题描述 投票:4回答:6

我无法自动播放我的视频,请帮忙。我的sdk版本

  android:minSdkVersion="14"
    android:targetSdkVersion="19" />

我试图在代码中指定javascript:

 public void onPageFinished(WebView view, String url) { webView.loadUrl("javascript:(function() { document.getElementsByTagName('video')[0].play(); })()"); }
            });

我也试图在URL中附加自动播放但不工作//webView.loadUrl("http://youtube.com/embed/oY2OxMpCUVY?autoplay=1");

我的网页设置`

customViewContainer = (FrameLayout)rootView.findViewById(R.id.customViewContainer);
        webView = (WebView) rootView.findViewById(R.id.HelpView_Video);
        final GlobleClass globalVariable = (GlobleClass) GlobleClass.getContext();
        mWebViewClient = new HelpWebViewClient();
        webView.setWebViewClient(mWebViewClient);
        mWebChromeClient = new myWebChromeClient();
        webView.setWebChromeClient(mWebChromeClient);
        webView.getSettings().setJavaScriptEnabled(true);
        webView.getSettings().setPluginState(PluginState.ON);
        webView.setWebViewClient(new WebViewClient() {
            // autoplay when finished loading via javascript injection
            public void onPageFinished(WebView view, String url) { webView.loadUrl("javascript:(function() { document.getElementsByTagName('video')[0].play(); })()"); }
        });
//        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN_MR1) {
//            webView.getSettings().setMediaPlaybackRequiresUserGesture(false);
//        }
        webView.getSettings().setAppCacheEnabled(true);
        //webView.getSettings().setBuiltInZoomControls(true);
      //  webView.getSettings().setSaveFormData(true);
        //webView.loadUrl("http://youtube.com/embed/oY2OxMpCUVY?autoplay=1");
        webView.loadUrl(globalVariable.getHelpVideoUrl());

`

java android webview youtube youtube-javascript-api
6个回答
2
投票

受到Orsi的answer的启发,我能够模仿显示视频播放器的WebView中心的onClick()事件。这最终会自动播放视频,或者更确切地说,无需用户的互动。

private class AutoPlayVideoWebViewClient extends WebViewClient {

    @Override
    public void onPageFinished(WebView view, String url) {
        super.onPageFinished(view, url);
        // mimic onClick() event on the center of the WebView
        long delta = 100;
        long downTime = SystemClock.uptimeMillis();
        float x = view.getLeft() + (view.getWidth()/2);
        float y = view.getTop() + (view.getHeight()/2);

        MotionEvent tapDownEvent = MotionEvent.obtain(downTime, downTime + delta, MotionEvent.ACTION_DOWN, x, y, 0);
        tapDownEvent.setSource(InputDevice.SOURCE_CLASS_POINTER);
        MotionEvent tapUpEvent = MotionEvent.obtain(downTime, downTime + delta + 2, MotionEvent.ACTION_UP, x, y, 0);
        tapUpEvent.setSource(InputDevice.SOURCE_CLASS_POINTER);

        view.dispatchTouchEvent(tapDownEvent);
        view.dispatchTouchEvent(tapUpEvent);
    }
}

某处,

myWebView.setWebViewClient(new AutoPlayVideoWebViewClient());

2
投票

首先使用下面的代码:

webSettings.setMediaPlaybackRequiresUserGesture(false);

之后使用以下方法加载:

webView.loadDataWithBaseURL("https://www.youtube.com/", HTML.replace("CUSTOM_ID","YOUR_YOUTUBE_VIDEO_ID"), "text/html", "utf-8", null);

在HTML字符串下面使用YouTube API传递代码(替换了您的YouTube视频ID)

    <!DOCTYPE html>
<html>
 <style type="text/css">
        html, body {
            height: 100%;
            width: 100%;
            margin: 0;
            padding: 0;
            background-color: #000000;
            overflow: hidden;
            position: fixed;
        }
    </style>
<body>

 <div id="player"></div>
<script>
       var tag = document.createElement('script');
       tag.src = "https://www.youtube.com/player_api";
       var firstScriptTag = document.getElementsByTagName('script')[0];
       firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
       var player;
       function onYouTubePlayerAPIReady() {
            player = new YT.Player('player', {
                    height: '100%',
                    width: '100%',
                    videoId: 'CUSTOM_ID',
                    events: {
                       'onReady': onPlayerReady,
                       'onStateChange': onPlayerStateChange
                  },
                  playerVars: {
                        'autoplay': 0,
                        'showinfo': 1,
                        'controls': 1
                                }
                            });
                        }
                        function onPlayerReady(event) {
                            event.target.playVideo();

                        }

                        var done = false;
                        function onPlayerStateChange(event) {
                            if (event.data == YT.PlayerState.PLAYING && !done) {
                                done = true;
                            }
                        }
                        function stopVideo() {
                            player.stopVideo();
                        }
                    </script> 

</body>
</html>

1
投票

最后我做到了..你需要使用这个API在“OnReady”事件上播放视频:https://developers.google.com/youtube/iframe_api_reference#Getting_Started

加载包含此示例中的代码的页面。

并确保你有

webSettings.setMediaPlaybackRequiresUserGesture(false);

(API 16+)


0
投票

您无法在webview上使用JavaScript进行自动播放。为了增强用户体验,WebKit禁用了在移动浏览器上自动播放视频的选项。


0
投票

自动播放问题是一个已知问题,请看看我的答案here


0
投票

Bonnyz在他的回答here中发布的代码的C#版本。以防有人需要它为Xamarin :)我测试它,它的工作原理。这是我发现在webview中自动播放youtube视频的唯一解决方案。

public class MyWebViewClient : WebViewClient
{
    WebView webView;
    MotionEvent motionEvent, motionEvent2;

    public override void OnPageFinished(WebView view, string url)
    {
        long delta = 100;
        long downTime = SystemClock.UptimeMillis();
        float x = view.Left + view.Width / 2;
        float y = view.Top + view.Height / 2;
        webView = view;

        motionEvent = MotionEvent.Obtain(downTime, downTime + delta, MotionEventActions.Down, x, y, 0);
        motionEvent2 = MotionEvent.Obtain(downTime + delta + 1, downTime + delta * 2, MotionEventActions.Up, x, y, 0);

        int delay = 100;
        view.PostDelayed(TapDown, delay);
        delay += 100;
        view.PostDelayed(TapUp, delay);
    }


    private void TapDown()
    {
        webView.DispatchTouchEvent(motionEvent);
    }

    private void TapUp()
    {
        webView.DispatchTouchEvent(motionEvent2); 
    }
}

要使用它:

webView.SetWebViewClient(new MyWebViewClient());
© www.soinside.com 2019 - 2024. All rights reserved.