YouTube视频无法在WebView中播放 - Android

时间:2012-10-03 12:50:47

标签: android video youtube android-webview

我想在WebView中播放YouTube视频,WebView首先显示带有播放按钮的视频,但点击播放按钮后开始进度条,2-3秒后停止进度条和黑色屏幕空白。

Image1:视频首次显示播放按钮

Image2:点击播放按钮后屏幕变为空白。

请!帮助我为什么视频没有开始。

图片:1 This is first look of web view

IMAGE:2 enter image description here

这是我在webview中播放YouTubeVideo的源代码..请帮帮我......

public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);
    WebView wv = (WebView) findViewById(R.id.webView1);
    wv.getSettings().setJavaScriptEnabled(true);
    wv.getSettings().setPluginsEnabled(true);
    final String mimeType = "text/html";
    final String encoding = "UTF-8";
    String html = getHTML();
    wv.loadDataWithBaseURL("", html, mimeType, encoding, "");
}

public String getHTML() {
    String html = "<iframe class=\"youtube-player\" style=\"border: 0; width: 100%; height: 95%; padding:0px; margin:0px\" id=\"ytplayer\" type=\"text/html\" src=\"http://www.youtube.com/embed/"
            + "J2fB5XWj6IE"
            + "?fs=0\" frameborder=\"0\">\n"
            + "</iframe>\n";
    return html;
}

10 个答案:

答案 0 :(得分:68)

在将HTML内容加载到WebView之前添加这些行。

wv.setWebChromeClient(new WebChromeClient() {
});

来自文档:

  

为了在您的应用程序中支持内联HTML5视频,您需要启用硬件加速,并设置WebChromeClient 。对于全屏支持,需要实现onShowCustomView(View,WebChromeClient.CustomViewCallback)和onHideCustomView(),getVideoLoadingProgressView()是可选的。

答案 1 :(得分:17)

需要以下代码来显示由Web核心框架启动的视频播放器。整个流程的关键是VideoView被传递回WebChromeClient,您需要将该视图附加到视图层次结构。

我通过查看作为AOSP一部分提供的浏览器源代码来组装它。

此代码引用了4个视图,这些视图可能并不明显。视图层次结构为:

  • FrameLayout mContentView(root)
  • WebView mWebView(mContentView的孩子)
  • FrameLAyout mCustomViewContainer(mContentView的孩子)
  • View mCustomView(mCustomViewContainer的孩子)

视图配置为设置容器活动的一部分。

<FrameLayout
    android:id="@+id/fullscreen_custom_content"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#FF000000"/>

    <FrameLayout
        android:id="@+id/main_content"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1" >

        <WebView
            android:id="@+id/webView"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent" />
    </FrameLayout>
</FrameLayout>

在您的活动中onCreate

    mContentView = (FrameLayout) findViewById(R.id.main_content);
    mWebView = (WebView) findViewById(R.id.webView);
    mCustomViewContainer = (FrameLayout) findViewById(R.id.fullscreen_custom_content);

使用WebChromeClient注册mWebView。该客户端应覆盖以下2 - 4种方法:

void onShowCustomView(View view, WebChromeClient.CustomViewCallback callback)
{
    // if a view already exists then immediately terminate the new one
    if (mCustomView != null)
    {
        callback.onCustomViewHidden();
        return;
    }

    // Add the custom view to its container.
    mCustomViewContainer.addView(view, COVER_SCREEN_GRAVITY_CENTER);
    mCustomView = view;
    mCustomViewCallback = callback;

    // hide main browser view
    mContentView.setVisibility(View.GONE);

    // Finally show the custom view container.
    mCustomViewContainer.setVisibility(View.VISIBLE);
    mCustomViewContainer.bringToFront();
}

void onHideCustomView()
{
    if (mCustomView == null)
        return;

    // Hide the custom view.
    mCustomView.setVisibility(View.GONE);
    // Remove the custom view from its container.
    mCustomViewContainer.removeView(mCustomView);
    mCustomView = null;
    mCustomViewContainer.setVisibility(View.GONE);
    mCustomViewCallback.onCustomViewHidden();

    // Show the content view.
    mContentView.setVisibility(View.VISIBLE);
}

public Bitmap getDefaultVideoPoster()
{
    if (mDefaultVideoPoster == null)
    {
        mDefaultVideoPoster = BitmapFactory.decodeResource(getResources(), R.drawable.default_video_poster);
    }
    return mDefaultVideoPoster;
}

public View getVideoLoadingProgressView()
{
    if (mVideoProgressView == null)
    {
        LayoutInflater inflater = LayoutInflater.from(this);
        mVideoProgressView = inflater.inflate(R.layout.video_loading_progress, null);
    }
    return mVideoProgressView;
}

您可能还想添加活动生命周期绑定,例如:

@Override
protected void onStop()
{
    super.onStop();
    if (mCustomView != null)
    {
        if (mCustomViewCallback != null)
            mCustomViewCallback.onCustomViewHidden();
        mCustomView = null;
    }
}

@Override
public void onBackPressed()
{
    if (mCustomView != null)
    {
        onHideCustomView();
    } else
    {
        finish();
    }
}

在您的活动中,在活动停止或按下后退按钮时隐藏视频。

答案 2 :(得分:12)

添加webview.setWebChromeClient(new WebChromeClient());并为您的视频添加启用插件

if (Build.VERSION.SDK_INT < 8) {
            webview.getSettings().setPluginsEnabled(true);
        } else {
            webview.getSettings().setPluginState(PluginState.ON);
        }

Thnaks

答案 3 :(得分:5)

移动设备上流式播放的youtbe视频存在一些问题。如果您直接尝试在Web视图中加载URL并运行它,则视频将无法播放。解决此问题的一种困难方法是在视频视图中流式传输视频。我没试过,但这可以做到。
其他播放YouTube视频的方式,我称之为更简单的方法是将网络视图设置中的用户代理从移动设备更改为桌面。用户代理指示将运行YouTube视频的设备类型,因此服务器会发送该类型的网页。通过这种方式,可以流式传输和播放YouTube视频。您可以通过以下方式执行此操作:

public static final int USER_MOBILE  = 0;
public static final int USER_DESKTOP = 1;
wv.getSettings().setUserAgent(USER_DESKTOP);   // 1 is for the desktop

答案 4 :(得分:2)

我复制了askers代码,它对我有用....我想你必须安装flash payer .. di u ??你添加了互联网权限吗?

btw我的代码在这里......

package com.example.youtube;



import android.annotation.SuppressLint;
import android.app.Activity;
import android.content.Intent;
import android.net.Uri;
import android.os.Bundle;
import android.os.Handler;
import android.widget.Button;
import android.widget.EditText;
import android.widget.ProgressBar;
import android.widget.Toast;
import android.util.Log;
import android.view.Menu;
import android.view.Window;
import android.view.WindowManager;
import android.webkit.DownloadListener;
import android.webkit.WebChromeClient;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebChromeClient;
import android.webkit.WebViewClient;
import android.view.View;
import android.view.ViewGroup;
import android.view.View.OnClickListener;
import android.widget.AbsoluteLayout;

import android.content.BroadcastReceiver;
import android.content.Context;
import android.content.IntentFilter;
import android.os.AsyncTask;
import android.util.Log;
import android.widget.TextView;


import android.location.Location;
import android.location.LocationListener;
import android.location.LocationManager;
public class MainActivity extends Activity{


    @SuppressLint("SetJavaScriptEnabled")
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        requestWindowFeature(Window.FEATURE_NO_TITLE);
        getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, 
                WindowManager.LayoutParams.FLAG_FULLSCREEN);
        getWindow().requestFeature(Window.FEATURE_PROGRESS);




            setContentView(R.layout.activity_main);


final ProgressBar Pbar;

Pbar = (ProgressBar) findViewById(R.id.pB4);
WebView wv = (WebView) findViewById(R.id.webVie1);
//wv.setWebViewClient(new Callback());
WebSettings webSettings = wv.getSettings();
webSettings.setBuiltInZoomControls(true);
webSettings.setJavaScriptEnabled(true);
//wv.setBackgroundColor(0x919191);
final String mimeType = "text/html";
final String encoding = "UTF-8";
String html = getHTML();
wv.loadDataWithBaseURL("", html, mimeType, encoding, "");




final Activity activity = this;

wv.setWebChromeClient(new WebChromeClient() {
       public void onProgressChanged(WebView view, int progress) {
         // Activities and WebViews measure progress with different scales.
         // The progress meter will automatically disappear when we reach 100%

         activity.setProgress(progress * 100);
         {
             if(progress < 100 && Pbar.getVisibility() == ProgressBar.GONE){
                 Pbar.setVisibility(ProgressBar.VISIBLE);

             }
             Pbar.setProgress(progress);
             if(progress == 100) {
                 Pbar.setVisibility(ProgressBar.GONE);

             }
          }
       }
     });
     wv.setWebViewClient(new WebViewClient() {
       public void onReceivedError(WebView view, int errorCode, String description, String failingUrl) {
         Toast.makeText(activity, "Oh no! " + description, Toast.LENGTH_LONG).show();
       }
     });
     wv.setDownloadListener(new DownloadListener()
     {

        public void onDownloadStart(String url, String userAgent,String contentDisposition, String mimetype,long contentLength)
         {
             Intent intent = new Intent(Intent.ACTION_VIEW, Uri.parse(url));

             startActivity(intent);   
         }


     });







}

    private String getHTML() {
        // TODO Auto-generated method stub
        String html1 = "<iframe class=\"youtube-player\" style=\"border: 0; width: 100%; height: 95%; padding:0px; margin:0px\" id=\"ytplayer\" type=\"text/html\" src=\"http://www.youtube.com/embed/"
                + "J2fB5XWj6IE"
                + "?fs=0\" frameborder=\"0\">\n"
                + "</iframe>\n";
        return html1;
    }


  /*  public void onPause()
    {
        super.onPause();
        System.exit(0);
    }*/




}

布局文件

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

<LinearLayout
    android:id="@+id/page_buttons"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:gravity="center_horizontal"
    android:orientation="horizontal" >


</LinearLayout>

<WebView
    android:id="@+id/webVie1"
    android:layout_width="316dp"
    android:layout_height="392dp"
    android:layout_alignParentBottom="true"
    android:layout_alignParentTop="true"
    android:layout_weight="0.99" />

<ProgressBar
    android:id="@+id/pB4"
    style="?android:attr/progressBarStyleHorizontal"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"/> />
</LinearLayout>

答案 5 :(得分:0)

为什么你想在webview中播放管视频?您可以使用此意图

播放它
startActivity(new Intent(Intent.ACTION_VIEW, Uri.parse(stringUrl)));

否则,如果您想在webView中播放,请点击此链接

http://www.stackoverflow.com/questions/9565533/android-how-to-play-youtube-video-in-webview?rq=1

答案 6 :(得分:0)

我的网络视图启用了JavaScript,但删除后使视频正常工作

        webView.setLayerType(View.LAYER_TYPE_SOFTWARE, null);

答案 7 :(得分:0)

以下适用于Android10。在您的Android活动/片段中加载“ WebView”。

检查this中是否有可用的项目。

private fun loadVideo(webView: WebView) {

    val videoUrl = "https://www.youtube.com/embed/5jJ-e278BFY"

    val embedString = "<iframe  src=\"$videoUrl\" frameborder=\"0\" allowfullscreen></iframe>"
    webView.webChromeClient = WebChromeClient()
    val webSettings = webView.settings
    webSettings.javaScriptEnabled = true
    webView.settings.loadWithOverviewMode = true

    var text = "<html><body style=\"text-align:justify;\">"
    text += embedString
    text += "</body></html>"
    webView.loadData(text, "text/html", "utf-8")
}

它使用IFrame Player API。 宽度(数字)–视频播放器的宽度。默认值为640。 height(数字)–视频播放器的高度。默认值为390。 videoId(字符串)– YouTube视频ID,用于标识播放器将加载的视频。

下面是UI xml

 <WebView
        android:id="@+id/webView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="40dp"
        android:visibility="visible"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/youtubeVideoFrameSubText" />

答案 8 :(得分:0)

myWebView.getSettings().setDomStorageEnabled(true);

答案 9 :(得分:-1)

试试这个

startActivity(new Intent(Intent.ACTION_VIEW, Uri.parse(stringUrl)));
相关问题