web-dev-qa-db-fra.com

la vidéo html5 ne fonctionne pas avec Android webview

J'utilise l'application Android en visualisation Web depuis un an. Mais certains clients disent que la vidéo html5 n'est pas lue dans mon application il y a quelques jours. J'ai cinq téléphones à tester et il n'y a rien de mal avec tous mes téléphones. La plupart des clients utilisent l'application sans aucun problème.

J'ai changé la valeur de la propriété de précharge de l'auto à la méta parce que je veux être dû à la charge du réseau.

L'image ci-dessous est une capture d'écran du client. Il y a un temps de 27:10 et il n'y a pas de spinner pour le chargement. (Je pense que le chargement est terminé) Cependant, le client ne peut pas appuyer sur le bouton de lecture, et lorsque le bouton de lecture est enfoncé, une ligne orange apparaît autour de l'élément vidéo.

enter image description here

Le téléphone portable du client est le Galaxy Note 8 et le Galaxy J7 et le Android version est 8. Mais dans mon test, il n'y a eu aucun problème. Et il y a Android 8 les clients qui utilisent le service sans aucun problème.

Comment puis-je le résoudre? Merci.

html

<video preload="meta" width="95%" autoplay="autoplay" controls="" playsinline="">               
        <source type="video/mp4" src="url.../file.mp4">
        HTML5 is not supported.
    </video>

Android - MainActivity

public class MainActivity extends AppCompatActivity {

    private WebView webView;
    private BackPressCloseHandler backPressCloseHandler = new BackPressCloseHandler(this);

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

        webView = findViewById(R.id.webView);
        /* webView settings */
        webView.getSettings().setSupportZoom(true);
        webView.getSettings().setBuiltInZoomControls(true);
        webView.getSettings().setJavaScriptEnabled(true);
        webView.getSettings().setCacheMode(WebSettings.LOAD_NO_CACHE);
        webView.setWebChromeClient(new FullscreenableChromeClient(MainActivity.this));
        webView.setWebViewClient(new WebViewClientClass());

        webView.loadUrl("MY URL IS HERE");
    } //onCreate

    private class WebViewClientClass extends WebViewClient {

        @Override
        public boolean shouldOverrideUrlLoading(WebView view, String url) {
            view.loadUrl(url);
            return true;
        }
    }

classe personnalisée pour activer la vidéo en plein écran

import Android.app.Activity;
import Android.content.Context;
import Android.os.Build;
import Android.support.v4.content.ContextCompat;
import Android.view.MotionEvent;
import Android.view.View;
import Android.view.ViewGroup;
import Android.view.Window;
import Android.view.WindowManager;
import Android.webkit.WebChromeClient;
import Android.widget.FrameLayout;

public class FullscreenableChromeClient extends WebChromeClient {
    private Activity mActivity = null;

    private View mCustomView;
    private WebChromeClient.CustomViewCallback mCustomViewCallback;
    private int mOriginalOrientation;
    private FrameLayout mFullscreenContainer;
    private static final FrameLayout.LayoutParams COVER_SCREEN_PARAMS = new FrameLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT);

    public FullscreenableChromeClient(Activity activity) {
        this.mActivity = activity;
    }

    @Override
    public void onShowCustomView(View view, CustomViewCallback callback) {

        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.ICE_CREAM_SANDWICH) {
            if (mCustomView != null) {
                callback.onCustomViewHidden();
                return;
            }

            mOriginalOrientation = mActivity.getRequestedOrientation();
            FrameLayout decor = (FrameLayout) mActivity.getWindow().getDecorView();
            mFullscreenContainer = new FullscreenHolder(mActivity);
            mFullscreenContainer.addView(view, COVER_SCREEN_PARAMS);
            decor.addView(mFullscreenContainer, COVER_SCREEN_PARAMS);
            mCustomView = view;
            setFullscreen(true);
            mCustomViewCallback = callback;
//          mActivity.setRequestedOrientation(requestedOrientation);

        }

        super.onShowCustomView(view, callback);
    }

    @SuppressWarnings("deprecation")
    @Override
    public void onShowCustomView(View view, int requestedOrientation, WebChromeClient.CustomViewCallback callback) {
        this.onShowCustomView(view, callback);
    }

    @Override
    public void onHideCustomView() {
        if (mCustomView == null) {
            return;
        }

        setFullscreen(false);
        FrameLayout decor = (FrameLayout) mActivity.getWindow().getDecorView();
        decor.removeView(mFullscreenContainer);
        mFullscreenContainer = null;
        mCustomView = null;
        mCustomViewCallback.onCustomViewHidden();
        mActivity.setRequestedOrientation(mOriginalOrientation);

    }

    private void setFullscreen(boolean enabled) {

        Window win = mActivity.getWindow();
        WindowManager.LayoutParams winParams = win.getAttributes();
        final int bits = WindowManager.LayoutParams.FLAG_FULLSCREEN;
        if (enabled) {
            winParams.flags |= bits;
        } else {
            winParams.flags &= ~bits;
            if (mCustomView != null) {
                mCustomView.setSystemUiVisibility(View.SYSTEM_UI_FLAG_VISIBLE);
            }
        }
        win.setAttributes(winParams);
    }

    private static class FullscreenHolder extends FrameLayout {
        public FullscreenHolder(Context ctx) {
            super(ctx);
            setBackgroundColor(ContextCompat.getColor(ctx, Android.R.color.black));
        }
        @Override
        public boolean onTouchEvent(MotionEvent evt) {
            return true;
        }
    }
}

manifest.xml

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:Android="http://schemas.Android.com/apk/res/Android"
    package="...">

    <uses-permission Android:name="Android.permission.INTERNET" />
    <uses-permission Android:name="Android.permission.READ_PHONE_STATE" />

    <application
        Android:allowBackup="true"
        Android:icon="@mipmap/ic_launcher"
        Android:label="@string/app_name"
        Android:roundIcon="@mipmap/ic_launcher_round"
        Android:supportsRtl="true"
        Android:hardwareAccelerated="true"
        Android:theme="@style/AppTheme">
        <activity Android:name="....webview.MainActivity"
            Android:configChanges="keyboardHidden|orientation|screenSize">

        </activity>
        <activity Android:name="....webview.IntroActivity">
            <intent-filter>
                <action Android:name="Android.intent.action.MAIN" />
                <category Android:name="Android.intent.category.LAUNCHER" />
            </intent-filter>

        </activity>
    </application>

</manifest>
androidhtmlwebviewuiwebviewhtml5-video
7
S.E Saint

Je rencontre les mêmes problèmes.

Pour arranger ça.

Mettez un id sur votre balise vidéo HTML et appelez ce id dans votre Java.

par exemple

<video id = "video" preload="meta" width="95%" autoplay="autoplay" controls="" playsinline=""><source type="video/mp4" src="url.../file.mp4"></video>

Sur onPageFinished - un remplacement pour WebViewClient, mettez ce code

webView.loadUrl("javascript:(function() { document.getElementById('video').play(); })()");
webView.loadUrl("javascript:(function() { document.getElementById('video').pause(); })()");

Cela injectera la fonction javascript pour permettre la lecture automatique de la vidéo

0
Jezrel Dave