android - Android webView 播放 YouTube 视频

Question

任何人都可以帮助使用此代码来播放嵌入在网站中的 youtube 视频吗？已经尝试了各种方法，包括清单中的 hardwareAccelerated=true。

webview 显示 youtube 页面和缩略图，但点击它们时没有任何反应。

在某些具有硬件加速的设备上，它播放声音但不播放视频。感谢大家！

package com.inglesupdated;

import java.util.ArrayList;

import android.app.AlertDialog;
import android.app.Dialog;
import android.content.Context;
import android.content.DialogInterface;
import android.content.Intent;
import android.graphics.Picture;
import android.net.Uri;
import android.os.Bundle;
import android.view.Gravity;
import android.view.LayoutInflater;
import android.view.Menu;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewGroup.LayoutParams;
import android.webkit.WebChromeClient;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.webkit.WebView.PictureListener;
import android.widget.Button;
import android.widget.LinearLayout;


public class BT_screen_customURL extends BT_activity_base{

    private boolean didCreate = false;
    private WebView webView = null;
    private String dataURL = "";
    private String currentURL = "";
    private String originalURL = "";
    private AlertDialog confirmLaunchInNativeAppDialogue = null;
    private AlertDialog confirmEmailDocumentDialogue = null;

    private String showBrowserBarBack = "";
    private String showBrowserBarLaunchInNativeApp = "";
    private String showBrowserBarEmailDocument = "";
    private String showBrowserBarRefresh = "";

    //////////////////////////////////////////////////////////////////////////
    //activity life-cycle events.

    //onCreate
    @Override
    public void onCreate(Bundle savedInstanceState){
        super.onCreate(savedInstanceState);
        this.activityName = "BT_screen_customURL";
        BT_debugger.showIt(activityName + ":onCreate"); 

        //reference to base layout..
        LinearLayout baseView = (LinearLayout)findViewById(R.id.baseView);

        //setup background colors...
        BT_viewUtilities.updateBackgroundColorsForScreen(this, this.screenData);

        //setup background images..
        if(backgroundImageWorkerThread == null){
            backgroundImageWorkerThread = new BackgroundImageWorkerThread();
            backgroundImageWorkerThread.start();
        }           

        //setup navigation bar...
        LinearLayout navBar = BT_viewUtilities.getNavBarForScreen(this, this.screenData);
        if(navBar != null){
            baseView.addView(navBar);
        }

        //inflate this screens layout file...
        LayoutInflater vi = (LayoutInflater)thisActivity.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        View thisScreensView = vi.inflate(R.layout.screen_customurl, null);


        //add the view to the base view...
        baseView.addView(thisScreensView);

        //reference to the webview in the layout file.

        webView = (WebView) thisScreensView.findViewById(R.id.webView);
        webView.setBackgroundColor(0);
        webView.setInitialScale(0);
        webView.getSettings().setJavaScriptEnabled(true);
        webView.getSettings().setSupportZoom(true);
        webView.getSettings().setBuiltInZoomControls(true);
        webView.getSettings().setPluginsEnabled(true);
        webView.setPictureListener(new MyPictureListener()); 
        webView.setWebChromeClient(new WebChromeClient());
        webView.setWebViewClient(new WebViewClient(){

            @Override
            public boolean shouldOverrideUrlLoading(WebView view, String url){

                //remember the URL...
                currentURL = url;

                //load the URL in the app's built-in browser if it's in our list of types to load...
                if(BT_act_controller.canLoadDocumentInWebView(url)){

                    //load url in built-in browser...
                //  showProgress(null, null);
                    return false;                   


                }else{

                    //ask user what app to open this in if the method returned NO...
                    try{
                        Intent i = new Intent(Intent.ACTION_VIEW, Uri.parse(url));
                        startActivity(Intent.createChooser(i, getString(R.string.openWithWhatApp)));  
                    }catch(Exception e){
                        BT_debugger.showIt(activityName + ": Error launching native app for url: " + url);
                        showAlert(getString(R.string.noNativeAppTitle), getString(R.string.noNativeAppDescription));
                    }

                    //do not try to load the URL..
                    return true;                    


                }

            }

            @Override
            public void onPageFinished(WebView view, String url){
                hideProgress();
                BT_debugger.showIt(activityName + ":onPageFinished finished Loading: " + url);
            }

            @Override
            public void onReceivedError(WebView view, int errorCode, String description, String failingUrl) {
                hideProgress();
                showAlert(getString(R.string.errorTitle), getString(R.string.errorLoadingScreen));
                BT_debugger.showIt(activityName = ":onReceivedError ERROR loading url: " + failingUrl + " Description: " + description);
            }           

        }); 


        //fill JSON properties...
        dataURL = BT_strings.getJsonPropertyValue(this.screenData.getJsonObject(), "dataURL", "");
        currentURL = dataURL;
        originalURL = dataURL;

        //button options for hardware menu key...
        showBrowserBarBack = BT_strings.getJsonPropertyValue(this.screenData.getJsonObject(), "showBrowserBarBack", "0");
        showBrowserBarLaunchInNativeApp = BT_strings.getJsonPropertyValue(this.screenData.getJsonObject(), "showBrowserBarLaunchInNativeApp", "0");
        showBrowserBarEmailDocument = BT_strings.getJsonPropertyValue(this.screenData.getJsonObject(), "showBrowserBarEmailDocument", "0");
        showBrowserBarRefresh = BT_strings.getJsonPropertyValue(this.screenData.getJsonObject(), "showBrowserBarRefresh", "0");


        //prevent user interaction?
        String preventUserInteraction = BT_strings.getJsonPropertyValue(this.screenData.getJsonObject(), "preventUserInteraction", "0");
        if(preventUserInteraction.equalsIgnoreCase("1")){
            //can't seem to get Android to "prevent user interaction"...??? 
        }

        //hide scroll bars..
        String hideVerticalScrollBar = BT_strings.getJsonPropertyValue(this.screenData.getJsonObject(), "hideVerticalScrollBar", "0");
        if(hideVerticalScrollBar.equalsIgnoreCase("1")){
            webView.setVerticalScrollBarEnabled(false);
        }
        String hideHorizontalScrollBar = BT_strings.getJsonPropertyValue(this.screenData.getJsonObject(), "hideHorizontalScrollBar", "0");
        if(hideHorizontalScrollBar.equalsIgnoreCase("1")){
            webView.setHorizontalScrollBarEnabled(false);
        }
        String preventAllScrolling = BT_strings.getJsonPropertyValue(this.screenData.getJsonObject(), "preventAllScrolling", "0");
        if(preventAllScrolling.equalsIgnoreCase("1")){
            webView.setVerticalScrollBarEnabled(false);
            webView.setHorizontalScrollBarEnabled(false);
        }       


        //figure out what to load...
        if(dataURL.length() > 1){

            String useUrl = BT_strings.mergeBTVariablesInString(dataURL);
            BT_debugger.showIt(activityName + ": loading URL from: " + useUrl);
            this.loadUrl(useUrl);

        }else{
            BT_debugger.showIt(activityName + ": No URL found? Not loading web-view!");
            showAlert(getString(R.string.errorTitle), getString(R.string.errorLoadingScreen));
        }


        //flag as created..
        didCreate = true;

        /*
         * *******************************************************************

         Notes: This screen has fully loaded it's layout file at this point. 

         BT_activity_base loaded act_base.xml 
         --THEN--
         this screen loaded it's own layout file. 

         JSON properties for this screen from the app's configuration data are 
         available for use. You can read these properties easily using the BT_strings class.

         Example: 
         String thisScreensNavBarTitleText = BT_strings.getJsonPropertyValue(this.screenData.getJsonObject(), "thisScreensNavBarTitleText", "default value here");

         The screens background and title bar were setup using the BT_viewUtilities class:
         BT_viewUtilities.updateBackgroundColorsForScreen() 

         You are free to modify the layout file and extend this screen however you want. 

         ********************************************************************
        */      



    }//onCreate

    //onStart
    @Override 
    protected void onStart() {
        //BT_debugger.showIt(activityName + ":onStart");    
        super.onStart();
    }

    //onResume
    @Override
    public void onResume() {
       super.onResume();
        //BT_debugger.showIt(activityName + ":onResume");

       //verify onCreate already ran...
       if(didCreate){

       }

    }

    //onPause
    @Override
    public void onPause() {
        super.onPause();
        //BT_debugger.showIt(activityName + ":onPause");    
    }

    //onStop
    @Override 
    protected void onStop(){
        super.onStop();
        //BT_debugger.showIt(activityName + ":onStop"); 
    }   

    //onDestroy
    @Override
    public void onDestroy() {
        super.onDestroy();
        //BT_debugger.showIt(activityName + ":onDestroy");  
    }

    //end activity life-cycle events
    //////////////////////////////////////////////////////////////////////////


    //load URL in webView
    public void loadUrl(String theUrl){
        BT_debugger.showIt(activityName + ": loadUrl");
        try{
            webView.loadUrl(theUrl);
        }catch(Exception e){
            BT_debugger.showIt(activityName + ":loadUrl Exception: " + e.toString());
        }
    }



    /*  Hardware Back-Key, uncomment as needed.
        Uncomment this to make the hardware back-key act like a browser back button
        Warning: If you do this the user will need to go "back" the number of times they
        when "forward" to return to the previous screen.
        @Override
        public boolean onKeyDown(int keyCode, KeyEvent event){
            if ((keyCode == KeyEvent.KEYCODE_BACK) && webView.canGoBack()){
                webView.goBack();
                return true;
            }
            //not the back-key..
            return super.onKeyDown(keyCode, event);
        }
    */

    //back button...
    public void handleBackButton(){
        BT_debugger.showIt(activityName + ":handleBackButton");
        if(webView.canGoBack()){
            webView.goBack();
        }else{
            BT_debugger.showIt(activityName + ":handleBackButton cannot go back?");
        }
    }

    //refresh button...
    public void handleRefreshButton(){
        BT_debugger.showIt(activityName + ":handleRefreshButton");
        if(currentURL.length() > 1){
            showProgress(null, null);
            webView.loadUrl(currentURL);
        }else{
            BT_debugger.showIt(activityName + ":handleRefreshButton cannot refresh?");
        }
    }

    //launch in native app button...
    public void handleLaunchInNativeAppButton(){
        BT_debugger.showIt(activityName + ":handleLaunchInNativeAppButton");
        if(currentURL.length() > 1 && originalURL.length() > 1){
            confirmLaunchInNativeApp();
        }else{
            showAlert(getString(R.string.errorTitle), getString(R.string.cannotOpenDocumentInNativeApp));
            BT_debugger.showIt(activityName + ":handleLaunchInNativeAppButton NO url?");
        }
    }

    //handle email button
    public void handleEmailDocumentButton(){
        BT_debugger.showIt(activityName + ":handleLaunchInNativeAppButton");
        showAlert(getString(R.string.errorTitle), getString(R.string.cannotEmailDocument));
        BT_debugger.showIt(activityName + ":handleEmailDocumentButton NO  document to email on URL screens");
    }

    //confirm launch in native app
    public void confirmLaunchInNativeApp(){
        confirmLaunchInNativeAppDialogue = new AlertDialog.Builder(this).create();
        confirmLaunchInNativeAppDialogue.setTitle(getString(R.string.confirm));
        confirmLaunchInNativeAppDialogue.setMessage(getString(R.string.confirmLaunchInNativeBrowser));
        confirmLaunchInNativeAppDialogue.setIcon(R.drawable.icon);

        //YES
        confirmLaunchInNativeAppDialogue.setButton(DialogInterface.BUTTON_POSITIVE, getString(R.string.yes), new DialogInterface.OnClickListener() {
          public void onClick(DialogInterface dialog, int which) {
              confirmLaunchInNativeAppDialogue.dismiss();

              //tell Android to load the URL in the best available Native App...
                try{
                    Intent i = new Intent(Intent.ACTION_VIEW, Uri.parse(currentURL));
                    startActivity(i);
                }catch(Exception e){
                    BT_debugger.showIt(activityName + ": Error launching native app for url: " + currentURL);
                    showAlert(getString(R.string.noNativeAppTitle), getString(R.string.noNativeAppDescription));
                }             
        } }); 

        //NO
        confirmLaunchInNativeAppDialogue.setButton(DialogInterface.BUTTON_NEGATIVE, getString(R.string.no), new DialogInterface.OnClickListener() {
            public void onClick(DialogInterface dialog, int which) {
                confirmLaunchInNativeAppDialogue.dismiss();
            } }); 

        //show the confirmation box...
        confirmLaunchInNativeAppDialogue.show();
    }       

    //confirm email document
    public void confirmEmailDocumentDialogue(){
        confirmEmailDocumentDialogue = new AlertDialog.Builder(this).create();
        confirmEmailDocumentDialogue.setTitle(getString(R.string.confirm));
        confirmEmailDocumentDialogue.setMessage(getString(R.string.confirmEmailDocument));
        confirmEmailDocumentDialogue.setIcon(R.drawable.icon);

        //YES
        confirmEmailDocumentDialogue.setButton(DialogInterface.BUTTON_POSITIVE, getString(R.string.yes), new DialogInterface.OnClickListener() {
          public void onClick(DialogInterface dialog, int which) {
              confirmEmailDocumentDialogue.dismiss();

              //tell Android launch the native email application...
              Intent emailIntent = new Intent(android.content.Intent.ACTION_SEND);  
              emailIntent.setType("plain/text");  
              emailIntent.putExtra(android.content.Intent.EXTRA_SUBJECT, getString(R.string.sharingWithYou));  
              emailIntent.putExtra(android.content.Intent.EXTRA_TEXT, currentURL);                

              //chooser will propmpt user if they have more than one email client..
              startActivity(Intent.createChooser(emailIntent, getString(R.string.openWithWhatApp)));  

        } }); 

        //NO
        confirmEmailDocumentDialogue.setButton(DialogInterface.BUTTON_NEGATIVE, getString(R.string.no), new DialogInterface.OnClickListener() {
            public void onClick(DialogInterface dialog, int which) {
                confirmEmailDocumentDialogue.dismiss();
            } }); 

        //show the confirmation box...
        confirmEmailDocumentDialogue.show();
    }       


    //see webView (above) where onPageFinished is loading too soon...
    class MyPictureListener implements PictureListener {
        public void onNewPicture(WebView view, Picture arg1) {
            //BT_debugger.showIt("here" + ":onNewPicture done");
            hideProgress();      
        }    
    }


    /////////////////////////////////////////////////////
    //options menu (hardware menu-button)
    @Override 
    public boolean onPrepareOptionsMenu(Menu menu) { 
        super.onPrepareOptionsMenu(menu); 

         //set up dialog
        final Dialog dialog = new Dialog(this);

        //linear layout holds all the options...
        LinearLayout optionsView = new LinearLayout(this);
        optionsView.setLayoutParams(new LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT));
        optionsView.setOrientation(LinearLayout.VERTICAL);
        optionsView.setGravity(Gravity.CENTER_VERTICAL);
        optionsView.setPadding(0, 0, 0, 20);

        //options have individual layout params
        LinearLayout.LayoutParams btnLayoutParams = new LinearLayout.LayoutParams(400, LayoutParams.WRAP_CONTENT);
        btnLayoutParams.setMargins(10, 10, 10, 10);
        btnLayoutParams.leftMargin = 10;
        btnLayoutParams.rightMargin = 10;
        btnLayoutParams.topMargin = 0;
        btnLayoutParams.bottomMargin = 10;

        //holds all the options 
        ArrayList<Button> options = new ArrayList<Button>();

        //cancel...
        final Button btnCancel = new Button(this);
        btnCancel.setText(getString(R.string.okClose));

        btnCancel.setOnClickListener(new OnClickListener(){
            public void onClick(View v){
                dialog.cancel();
            }
        });
        options.add(btnCancel);

        //back...
        if(showBrowserBarBack.equalsIgnoreCase("1")){
            final Button btn = new Button(this);
            btn.setText(getString(R.string.browserBack));
            btn.setOnClickListener(new OnClickListener(){
                public void onClick(View v){
                    dialog.cancel();
                    handleBackButton();
                }
            });
            options.add(btn);
        }

        //launch in native app...
        if(showBrowserBarLaunchInNativeApp.equalsIgnoreCase("1")){
            final Button btn = new Button(this);
            btn.setText(getString(R.string.browserOpenInNativeApp));
            btn.setOnClickListener(new OnClickListener(){
                public void onClick(View v){
                    dialog.cancel();
                    handleLaunchInNativeAppButton();
                }
            });
            options.add(btn);
        }   

        //email document...
        if(showBrowserBarEmailDocument.equalsIgnoreCase("1")){
            final Button btn = new Button(this);
            btn.setText(getString(R.string.browserEmailDocument));
            btn.setOnClickListener(new OnClickListener(){
                public void onClick(View v){
                    dialog.cancel();
                    handleEmailDocumentButton();
                }
            });
            options.add(btn);
        }

        //refresh page...
        if(showBrowserBarRefresh.equalsIgnoreCase("1")){
            final Button btn = new Button(this);
            btn.setText(getString(R.string.browserRefresh));
            btn.setOnClickListener(new OnClickListener(){
                public void onClick(View v){
                    dialog.cancel();
                    handleRefreshButton();
                }
            });
            options.add(btn);
        }       

        //refreshAppData (if we are on home screen)
        if(this.screenData.isHomeScreen() && inglesupdated_appDelegate.rootApp.getDataURL().length() > 1){

            final Button btnRefreshAppData = new Button(this);
            btnRefreshAppData.setText(getString(R.string.refreshAppData));
            btnRefreshAppData.setOnClickListener(new OnClickListener(){
                public void onClick(View v){
                    dialog.cancel();
                    refreshAppData();
                }
            });
            options.add(btnRefreshAppData);         
        }       

        //add each option to layout, set layoutParams as we go...
        for(int x = 0; x < options.size(); x++){
            options.get(x).setLayoutParams(btnLayoutParams);
            options.get(x).setPadding(5, 5, 5, 5);
            optionsView.addView(options.get(x));
        }


        //set content view..        
        dialog.setContentView(optionsView);
        if(options.size() > 1){
            dialog.setTitle(getString(R.string.menuOptions));
        }else{
            dialog.setTitle(getString(R.string.menuNoOptions));
        }
        //show
        dialog.show();
        return true;

    } 
    //end options menu
    /////////////////////////////////////////////////////   






}

Answer 1

在尝试使用在 10 个 Google 搜索页面上找到的不同解决方案在 WebView 中播放 Youtube 视频 3 天后，一些解决方案有效，但并非适用于所有设备或操作系统版本，我决定以我自己的方式思考。

对我来说，直接在 WebView 上播放视频的解决方案即使在最后一个 Android 设备上也会产生许多工件：Nexus 4 所以，我必须找到一种方法来捕捉 Youtube iframe 上的点击，以便直接启动 Youtube 应用程序iOS 无需任何开发人员的努力即可完美运行。

public class MyWebViewClient extends WebViewClient {

    public Activity mActivity;

    public MyWebViewClient(Activity activity) {
        super();
        mActivity = activity;
    }

    @Override
    public boolean shouldOverrideUrlLoading(WebView view, String url) {
        Uri uri = Uri.parse(url);
        if (uri.getHost().contains("youtube.com")) {
            IntentUtils.viewYoutube(mActivity, url);
            return true;
        }

        return false;
    }

    public static void viewYoutube(Context context, String url) {
        IntentUtils.viewWithPackageName(context, url, "com.google.android.youtube");
    }

    public static void viewWithPackageName(Context context, String url, String packageName) {
        try {
            Intent viewIntent = new Intent(Intent.ACTION_VIEW, Uri.parse(url));
            if (isAppInstalled(context, packageName)) {
                viewIntent.setPackage(packageName);
            }
            context.startActivity(viewIntent);
        } catch (Exception e) {
            Intent viewIntent = new Intent(Intent.ACTION_VIEW, Uri.parse(url));
            context.startActivity(viewIntent);
        }
    }

    public static boolean isAppInstalled(Context context, String packageName) {
        PackageManager packageManager = context.getPackageManager();
        try {
            packageManager.getPackageInfo(packageName, PackageManager.GET_ACTIVITIES);
            return true;
        } catch (NameNotFoundException e) {
        }
        return false;
    }

    @Override
    public void onPageFinished(final WebView view, String url) {
        String javascript = "javascript:" +
            "var iframes = document.getElementsByTagName('iframe');" +
            "for (var i = 0, l = iframes.length; i < l; i++) {" +
            "   var iframe = iframes[i]," +
            "   a = document.createElement('a');" +
            "   a.setAttribute('href', iframe.src);" +
            "   d = document.createElement('div');" +
            "   d.style.width = iframe.offsetWidth + 'px';" +
            "   d.style.height = iframe.offsetHeight + 'px';" +
            "   d.style.top = iframe.offsetTop + 'px';" +
            "   d.style.left = iframe.offsetLeft + 'px';" +
            "   d.style.position = 'absolute';" +
            "   d.style.opacity = '0';" +
            "   d.style.filter = 'alpha(opacity=0)';" +
            "   d.style.background = 'black';" +
            "   a.appendChild(d);" +
            "   iframe.offsetParent.appendChild(a);" +
            "}";
        view.loadUrl(javascript);

        super.onPageFinished(view, url);
    }
}

顺便说一句，我对为向开发人员提供可接受的 WebView 所做的一些努力感到有些不安。

即使我理解希望避免仅基于 HTML 的 Android 应用程序，它始终是在详细信息页面上显示丰富内容的最佳/最快方式。例如，在我的例子中，我管理一个基于 RSS 的应用程序，它允许我的客户自己更改内容。

此外，与 Windows Phone 开发相比，我们必须花费时间将 UI 与网络数据和保存的数据链接起来，在 Windows Phone 开发中，每个数据都直接链接到 UI 组件。

Answer 2

Thomas G. 的解决方案对我有用，但是我不得不修改 javascript。

String javascript = "javascript:" +
                "setTimeout(function() {" +
                "   var iframes = document.getElementsByTagName('iframe');" +
                "   for (var i = 0, l = iframes.length; i < l; i++) {" +
                "       var iframe = iframes[i]," +
                "       a = document.createElement('a');" +
                "       a.setAttribute('href', iframe.src);" +
                "       d = document.createElement('div');" +
                "       d.style.width = iframe.offsetWidth + 'px';" +
                "       d.style.height = iframe.offsetHeight + 'px';" +
                "       d.style.top = iframe.offsetTop + 'px';" +
                "       d.style.left = iframe.offsetLeft + 'px';" +
                "       d.style.position = 'absolute';" +
                "       d.style.opacity = '0';" +
                "       d.style.filter = 'alpha(opacity=0)';" +
                "       d.style.zIndex='" + Integer.MAX_VALUE + "';" +
                "       d.style.background = 'black';" +
                "       a.appendChild(d);" +
                "       iframe.offsetParent.appendChild(a);" +
                "   }" +
                "}, 600);";

在 onPageFinished 事件解决了三星 Tab 设备上的一个问题之后执行 javascript，如果 js 立即执行，该问题似乎还没有准备好。我尝试了 onload 事件 / $(document).ready 但仍然没有工作。等待 600 毫秒并不理想，但我已经花了足够的时间试图让它工作。

确保 z-index 大于 iframe 的，最简单的方法是将 zIndex 设置为Integer.MAX_VALUE