Android HTML5 video – funciona al hacer clic en play, pero no video.play ()

Entiendo que el vídeo html5 en android no puede autoplay. Tal como está, mi video funciona en el dispositivo sólo cuando el usuario hace clic en el botón de reproducción.

<video width="640px" height="360px" src="media/video/Moments_of_Everyday_Life.mp4" controls id="video"></video> <script type="text/javascript"> $(function(){ var video = document.getElementById('video'); video.play(); }); </script> 

¿Por qué esto no funcionaría? ¿Y cuál es la diferencia entre hacer clic y usar este método de .play ()?

ACTUALIZAR

Esto funciona en mi dekstop, no sólo en el dispositivo Android.

No funcionaría por la misma razón que los navegadores bloquean las llamadas a window.open() , porque permitiendo que permitiera a los desarrolladores web subvertir la preferencia de los usuarios no a los medios de reproducción automática (o abrir ventanas emergentes).

La diferencia entre hacer clic y usar este método es exactamente lo que has dicho: el clic. Este tipo de llamadas se permiten en eventos de clic, pero no en general.

¡Yo tengo que trabajar! Ahora puede reproducir video HTML5 en línea con "autoplay" trabajando! ¡Maldición que esto tomó tiempo! Ok esto es lo que hice:

 <div id=content> <video width="1280px" height="720px" src="file:///android_asset/videos/Moments_of_Everyday_Life.mp4"></video> </div> 

Nota: Algunas personas dicen que lo hacen funcionar cuando se agrega cartel y / o precarga. Tengo este trabajo con y sin.

JavaScript autoplay el video:

 <script type="text/javascript"> $(function(){ function callback () { document.querySelector('video').src = document.querySelector('video').src document.querySelector('video').play(); } window.addEventListener("load", callback, false); }); </script> 

Espero que esto pueda ayudar a cualquiera, he luchado con esto durante una semana ahora!

Solo para aclarar:

trabajando en:

Android 4.0.4 Samsung 10.1 Tablet Navegador de dispositivos nativos

He realizado los descubrimientos siguientes sobre el video HTML5 en Android 4.0 y versiones posteriores. Conseguir esto investigado ha tomado una semana de ensayo y error – y los problemas variaron con cada versión principal de Android. GOOGLE: ¡NO DEBE SER ESTA MUCHO DE UNA PITA !!!!

Para realizar estas pruebas, hice una aplicación de sandbox que consistía en una página HTML guardada en / assets.

HTML:

 <!DOCTYPE html> <html> <head> <title>HTML5 Video Test</title> </head> <body> <video preload="metadata"><source src="http://www.w3schools.com/html/movie.mp4" type="video/mp4"></video> <script> var myvideo = document.getElementsByTagName('video')[0]; myvideo.addEventListener('loadeddata', function() { console.log("** RECEIVED loadeddata **"); myvideo.play();//this first play is needed for Android 4.1+ }, false); myvideo.addEventListener('canplaythrough', function() { console.log("** RECEIVED canplaythrough **"); myvideo.play();//this second play is needed for Android 4.0 only }, false); </script> </body> </html> 

JAVA: ("/assets/html5video.html")

 private WebView mWebView; private ProgressBar mProgressBar; @SuppressLint("NewApi") @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.videotest); // progress bar mProgressBar = (ProgressBar) findViewById(R.id.videotest_progressbar); mProgressBar.setProgress(0); mProgressBar.setVisibility(View.VISIBLE); // webview mWebView = (WebView) findViewById(R.id.videotest_webview); mWebView.getSettings().setJavaScriptEnabled(true); if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN_MR1) { //NOTE: this is required only for Android 4.2.2+ mWebView.getSettings().setMediaPlaybackRequiresUserGesture(false); } mWebView.setWebChromeClient(new WebChromeClient() { public void onProgressChanged(WebView view, int progress) { Log.i(TAG, "Progress = "+progress); mProgressBar.setProgress(progress); } }); mWebView.setWebViewClient(new WebViewClient() { public void onReceivedError(WebView view, int errorCode, String description, String failingUrl) { Toast.makeText(TestActivity.this, "Problem loading webpage", Toast.LENGTH_LONG).show(); mProgressBar.setVisibility(View.GONE); } public void onPageFinished(WebView view, String url) { mProgressBar.setVisibility(View.GONE); } }); } @Override protected void onResume() { super.onResume(); mWebView.loadUrl("file:///android_asset/html5video.html"); } 

Android 4.0.3 NOTA

Seguí funcionando en la excepción molesta java.lang.Throwable: EventHub.removeMessages(int what = 107) is not supported before the WebViewCore is set up. Afortunadamente, no afectó a la reproducción de vídeo.

Después de horas de buscar y probar "soluciones" este es el que trabajó para mí! Resuelto por los refrigeradores enojados ¡ USTED ES EL HOMBRE … O LA MUJER !!

 <video id="video" class="video" autoplay muted > 

Notaron tanto la reproducción automática como la silenciada , ambas son necesarias.

Esto permitió que el video se reprodujera tanto en la computadora como en el teléfono Android.

O puede inicializar su WebView para hacerlo fácilmente, de la siguiente manera:

  webview.setWebViewClient(new WebViewClient() { // autoplay when finished loading via javascript injection public void onPageFinished(WebView view, String url) { mMessageContentView.loadUrl("javascript:(function() { document.getElementsByTagName('video')[0].play(); })()"); } }); 

Lo anterior funciona bien para mí.

He encontrado en kitkat que Firefox le permitirá reproducir videos mediante programación.

Además, Chrome también entrará en chrome: // flags y habilitará la opción "Disable gesture requirement for media playback".

  • ¿Qué carga de formato h.264 en android y IOS?
  • Html5 video no se reproduce en android webview, pero funciona en (móvil) cromo
  • HTML 5 Reproducción automática Google Chrome Android No reproducción
  • Cómo reproducir video HTML5 mp4 en Android?
  • La vista web de Android no reproduce video, jwembedder
  • NullPointerException al ingresar video en pantalla completa webview nokia x
  • Interceptar solicitud de fuente de video HTML5 en Android WebView
  • Pantalla completa de vídeo HTML5 en navegadores móviles (android)
  • Detectar la máxima resolución de vídeo compatible con un dispositivo móvil en un sitio web que responda
  • Reproducción de video HTML5 en pantalla completa en la vista web de Android
  • Implementar onShowCustomView en Android 3.1 lanza excepciones en HTML5VideoFullScreen
  • FlipAndroid es un fan de Google para Android, Todo sobre Android Phones, Android Wear, Android Dev y Aplicaciones para Android Aplicaciones.