Android WebView - Youtube 视频不在应用程序内播放

Question

我有一个使用 WebView 显示网页的活动。在该页面中，有一个指向 YouTube 视频的链接（因此它不是我可以或需要嵌入的视频）。

问题是视频无法播放 - 当我点击播放按钮时，出现错误页面 “ 网页无法显示 vnd.youtube 上的网页：SVf8Ghl6d8xx 可能会暂时倒下，等等等等！！！”

如果你知道我想要什么，请只回答！我已经浏览了几乎所有关于 stackoverflow 的相关帖子，因此无需参考其他帖子/问题。

MainActivity.java

@Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);


        // add the custom view to the action bar
        webView = (WebView) findViewById(R.id.webView1);
        webView.getSettings().setJavaScriptEnabled(true);

        if(Build.VERSION.SDK_INT < Build.VERSION_CODES.JELLY_BEAN_MR2)
            webView.getSettings().setPluginState(WebSettings.PluginState.ON);   //Helps flash run on a device

        webView.getSettings().setBuiltInZoomControls(true);

        webView.setWebViewClient(new WebViewClient ());
        webView.setWebChromeClient(new WebChromeClient());
        webView.getSettings().setUseWideViewPort(true);
        //webView.getSettings().setUseWideViewPort(false);
        webView.setScrollBarStyle(WebView.SCROLLBARS_OUTSIDE_OVERLAY);
        webView.loadUrl(url);

    }

以下代码使其在 youtube 应用程序中运行，但我希望视频在我的应用程序中运行:(

@Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);


        // add the custom view to the action bar
        webView = (WebView) findViewById(R.id.webView1);
        webView.getSettings().setJavaScriptEnabled(true);
        webView.getSettings().setBuiltInZoomControls(true);

        if(Build.VERSION.SDK_INT < Build.VERSION_CODES.JELLY_BEAN_MR2)
                    webView.getSettings().setPluginState(WebSettings.PluginState.ON);


        webView.setWebViewClient(new WebViewClient () {
            @ Override
            public boolean shouldOverrideUrlLoading(WebView view, String url) {
            if (url.startsWith("vnd.youtube")){

                startActivity(new Intent(Intent.ACTION_VIEW, Uri.parse(url)));

                return true;
            }
            else return false;

            }
        });

        webView.setWebChromeClient(new WebChromeClient());
        webView.getSettings().setUseWideViewPort(true);
        //webView.getSettings().setUseWideViewPort(false);
        webView.setScrollBarStyle(WebView.SCROLLBARS_OUTSIDE_OVERLAY);
        webView.loadUrl(url);

    }

Answer 1

1. 转到 Google Developer Console 并选择或创建一个新项目。

2. 在左侧边栏中，选择 APIs & auth 下的 APIs，然后为 YouTube Data API v3 开启状态。

3. 在左侧边栏中，选择 Credentials 并在 Public API access 下选择 Create new key。

4. 当弹出窗口要求您选择平台时，选择 Android Key。

5. 粘贴 SHA-1 密钥和项目的包名称，用分号 (;) 分隔。

6. 点击创建。现在您应该在仪表板上看到 API KEY。

从这里下载 YouTubeAPI jar

https://developers.google.com/youtube/android/player/downloads/

创建这样的布局

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">

<com.google.android.youtube.player.YouTubePlayerView
    android:id="@+id/youtube_player"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/black"
    android:layout_centerInParent="true" />

  </RelativeLayout>

您的活动应该如下所示

public class CustomYouTubePlayer extends YouTubeBaseActivity implements   YouTubePlayer.OnInitializedListener{


private String API_KEY="your key";
private String VIDEO_ID;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    /** attaching layout xml **/
    setContentView(R.layout.youtube_player);

    /** Initializing YouTube player view **/
    VIDEO_ID = getIntent().getExtras().getString(FinalVariables.YOUTUBE_ID);
    YouTubePlayerView youTubePlayerView = (YouTubePlayerView) findViewById(R.id.youtube_player);
    youTubePlayerView.initialize(API_KEY, this);
}

@Override
public void onInitializationSuccess(Provider provider, YouTubePlayer player, boolean wasRestored) {

    player.setShowFullscreenButton(false);
    /** add listeners to YouTubePlayer instance **/
    player.setPlayerStateChangeListener(playerStateChangeListener);
    player.setPlaybackEventListener(playbackEventListener);

    /** Start buffering **/
    if (!wasRestored) {
        player.loadVideo(VIDEO_ID);
    }
}
private YouTubePlayer.PlaybackEventListener playbackEventListener = new YouTubePlayer.PlaybackEventListener() {

    @Override
    public void onBuffering(boolean arg0) {
    }

    @Override
    public void onPaused() {
    }

    @Override
    public void onPlaying() {
    }

    @Override
    public void onSeekTo(int arg0) {
    }

    @Override
    public void onStopped() {
    }

};

 private YouTubePlayer.PlayerStateChangeListener playerStateChangeListener = new YouTubePlayer.PlayerStateChangeListener() {

    @Override
    public void onAdStarted() {
    }

    @Override
    public void onError(YouTubePlayer.ErrorReason arg0) {
    }

    @Override
    public void onLoaded(String arg0) {
    }

    @Override
    public void onLoading() {
    }

    @Override
    public void onVideoEnded() {
        finish();
    }

    @Override
    public void onVideoStarted() {
    }
};
} 

只需传递视频 ID，就这么简单..

编辑

如果这是您的 YouTube 链接 https://www.youtube.com/watch?v=rql_F8H3h9E 那么你的 video_id=rql_F8H3h9E 从 YouTube 链接中提取您的视频 ID，并将其作为额外变量发送到此活动。

Answer 2

在应用中嵌入 youtube 视频的最佳方式是使用 Youtube API

YouTube Android 播放器 API 使您能够将视频 播放功能到您的 Android 应用程序。 API 定义 加载和播放 YouTube 视频（和播放列表）的方法以及 自定义和控制视频播放体验。

Answer 3

为此，您需要将嵌入 YouTube 视频的 iFrame 代码转换为字符串，并将其作为字符串加载到应用程序中的 webview。

例如，

 String frameVideo = "<html><body>Youtube video .. <br> <iframe width="320" height="315" src="https://www.youtube.com/embed/lY2H2ZP56K4" frameborder="0" allowfullscreen></iframe></body></html>";

然后在所有正常的 webview 设置之后将它加载到你的 webview

WebView displayVideo = (WebView)findViewById(R.id.webView);
displayVideo.setWebViewClient(new WebViewClient(){
                @Override
                public boolean shouldOverrideUrlLoading(WebView view, String url) {
                    return false;
                }
            });
  WebSettings webSettings = displayVideo.getSettings();
            webSettings.setJavaScriptEnabled(true);
            displayVideo.loadData(frameVideo, "text/html", "utf-8");

有关更多信息，请参阅此链接123