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 ()?
- ¿Hay una manera de hacer que VideoView siga jugando en segundo plano en la aplicación para Android?
- Detener interminable búfer de vídeo html5 en cordova webview en dispositivos Samsung
- Android (Samsung S4) Pausas de vídeo HTML5
- ¿Cómo desactivar la interacción con los vídeos html5 en webview o capturar correctamente sus excepciones?
- La vista web de Android no reproduce el video mp4 en la misma página
ACTUALIZAR
Esto funciona en mi dekstop, no sólo en el dispositivo Android.
- WebView de pantalla parcial con <video> cortado por la mitad
- El video HTML5 en el modo de pantalla completa en la aplicación cordova se estira en dispositivos Android
- Pantalla negra en cromo para video html5 de Android
- Video HTML5 - búsqueda precisa en dispositivos Android?
- Reproducción de vídeos del sistema de archivos Chrome no funciona en Android
- Android 2.X HTML5 Video final pantalla completa
- El video se reproduce solo una vez en la vista Web de Android
- ¿Cómo se deben formatear las restricciones (Android) / Chrome getUserMedia ()?
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".
- Inclusión / exclusión de recursos condicionales para Android apk build
- Eliminación post-compilación de anotaciones del código de bytes