I've got a problem playing Youtube(or any) video in react-native's webview on android device. iOS works just fine.
I've already looked at several SO related questions, but everyone seem to suggest two things:
webview.setWebChromeClient(new WebChromeClient()); which is as far as I am concerned default in react-native's webview since few versions later
enable hardware acceleration android:hardwareAccelerated="true" in AndroidManifest.xml (which I have done)
All I got is a rendered player with controls and everything, but black screen.
Related
I am using webview to render a page having videos, but the videos on the page keep lagging. But the same page works very well in chrome.
I have set android:hardwareAccelerated="true" in manifest file and also have added webView.setWebChromeClient(new WebChromeClient()) to my java file but has not helped much (the rendering is better but still has some lagging). Is there any way to use the chrome features in webview so that lagging of video can be removed.
I am using the following: -
Android 7 (Nougat) in Android TV player.
Thanks in advance !!
I am attempting to play an HTML5 video within my WebView app. It works as expected on every device I have tested that is running Android 5.x, but does not work on any device running 4.x, meaning it essentially doesn't work at all.
I have turned on hardware acceleration and I have set a WebChromeClient as the docs say to do, but the video still will not play.
In order to support inline HTML5 video in your application, you need
to have hardware acceleration turned on, and set a WebChromeClient.
AndroidManifest.xml
<application>
android:hardwareAccelerated="true"
...
</application>
MyFragment.java
webView = new WebView(getActivity(), null, this);
webView.setWebChromeClient(new WebChromeClient());
Is there something else I need to do that is not documented in the developer reference?
The problem is WebKit poorly handles redirects for videos. There are videos within webpages from my company's proprietary API. When a video is clicked, the call goes to our API, then redirects to Amazon S3 to get the actual video file. WebKit then tries to "chunk" the video (instead of pre-loading the entire thing) as you would expect. However, S3 has already done that, which causes the playback to be completely broken.
Android 5.x works fine because WebView is based upon Chromium starting in 4.4, which handles the redirect appropriately.
I have an Android KitKat application with an embedded WebView. The page contains an html5 video element. The video loads fine, but play() has no effect until I tap the play button on the screen, and then play() and pause() work fine. I have also tried myWebView.setWebChromeClient(new WebChromeClient());, but this makes no difference. Also, this same page works fine in Chrome browsers on Mac and Linux.
Well, I found the problem. Android 4+ will not allow autoplay of video or programmatic start of play without first having the user tap the play button on the screen. This is so the user will implicitly acknowledge the use of bandwidth by manually activating playback. While I understand why this would be reasonable for a phone user with a cell connection, my application is a television with an Android HDMI stick. This is a very unfortunate restriction. See more here: Autostart html5 video using android 4 browser
EDIT: There is a workaround - while the stock browser cannot achieve this, using an embedded WebView gives you a little more control:
WebView myWebView = (WebView) findViewById(R.id.webview);
myWebView.setWebChromeClient(new WebChromeClient());
myWebView.getSettings().setMediaPlaybackRequiresUserGesture(false);
This solved the problem!
I'm using WebViews in my apps, and many users reported some issues. It appears that most of them seem to happen on 4.1.1, not before.
The configuration:
A Webview, inside a HW accelerated activity.
JS enabled, Plugins enabled, File access enabled, DOM storage enabled.
Custom WebChromeClient and WebViewClient.
Webview has a transparent background (0X00000000) but removing it seems to have no good improvement.
The problem:
Random black outs when showing some URLs: black out meaning, the activity just dies, there is no JAVA exception.
Usually, logs report a SIGSEGV, in glDrawArrays(), but could also be somewhere else (not enough information from users).
A workaround?
Simply disable the HW acceleration on the webview! Yeah, no more black out, that's right... But then (even if we consider this workaround is just so so, as the display performance decreases quite a lot):
A new problem:
Without HW acceleration, HTML5 videos (youtube) are not working: Sound starts, but video doesn't.
A solution could be to catch a playback starting event, to make the video play in a videoView, the same way we can do for fullscreen playback (using onShowCustomView, see Playing HTML5 video on fullscreen in android webview). Nevertheless, I'm currently not able to catch such an event. Please note that I'm not owner of the HTML pages, and the HTML code cannot be changed to append some kind of Javascript code in it.
Questions:
Does anyone has the same kind of crash, using HW acceleration + webview, on many devices? If so, how do you solve that?
About the workaround, deos anyone know how to solve this problem? Would be great to do like on IOS: clicking on the does not try to play the video inline, but instead it just opens the video application.
Thanks for reading!
I'm using a webView in my Android app to load YouTube iframe player and auto play videos. It works fine on Samsung Galaxy S2 & S3, but when runs on Samsung Galaxy S4, it always results in gray screen when trying to auto play.
On Galaxy S4, it works fine without autoplay, needs user action(click) to start playing
(Nothing happened if adding "autoplay:1" in playerVars).
I tried to call player.playVideo() in onPlayerReady(), it resulted in this gray screen:
The LogCat also shows a weird error message:
E/IMGSRV(17004): :0: GetPTLAFormat: Invalid format
when failed to autoplay. I don't know what this message is about; I've googled it and found nothing.
Here's the Android code of WebView:
WebView wv = (WebView) findViewById(R.id.webview);
WebSettings websettings = wv.getSettings();
websettings.setJavaScriptEnabled(true);
websettings.setDomStorageEnabled(true);
websettings.setDatabaseEnabled(true);
wv.loadUrl(strUrl);
wv.setWebViewClient(new WebViewClient());
wv.setWebChromeClient(new WebChromeClient());
wv.setPadding(0, 0, 0, 0);
wv.getSettings().setLoadWithOverviewMode(true);
wv.getSettings().setUseWideViewPort(true);
wv.setVerticalScrollBarEnabled(false);
wv.setHorizontalScrollBarEnabled(false);
Is this a known issue or if there's any solution to autoplay the video? Thanks!
I think disabling autoplay is becoming a "standard".
In iOS Safari, autoplay in HTML5 tags is disabled. (http://developer.apple.com/library/safari/#documentation/AudioVideo/Conceptual/Using_HTML5_Audio_Video/Device-SpecificConsiderations/Device-SpecificConsiderations.html#//apple_ref/doc/uid/TP40009523-CH5-SW4)
In Chrome, autoplay is also disabled. (https://code.google.com/p/chromium/issues/detail?id=159336)
I believe the same happens with the recent versions of the default Android Web Browser.
By the way, you could try this
EDIT:
As the link is dead, I found it in https://lumi.do/p/04x626i1ngvht/how-to-autoplay-html5-video-on-android:
How to "autoplay" HTML5 video on Android
Written by Mathias Desloges in Labs on 19/05/11
Have you ever try to play with the new HTML5 video tag on an Android device?
We have and here is an stange issue which we faced.
Let's set up the context, we want our video starts playing just after the page load complete.
According to the HTML5 specification, we should use the "autoplay" attribute, but it has no effect in Android. So we tried with a little script tha call the play function after the page has loaded:
function callback () { document.querySelector('video').play(); }
window.addEventListener("load", callback, false);
This reproduces well the behavior of the "autoplay" attribute on a
classic desktop browser, but on an Android browser it fails. we
tried to attach the previously defined "callback()" function to a
click event on a arbitrary node, and the video starts playing well "on
click" (normal behavior). And while continue working on the page html
code, we found the solution!
Don't ask me why, but after adding the "poster" attribute it works!
I believe this is a symptom of the OS manufacturers becoming more restrictive in not letting videos autoplay due to bandwidth concerns. This has been an issue on iOS for some time where any JavaScript call to play() will fail unless the user has performed some action like a click first.
That is likely what is going on in your case.
As answered here I believe it's not just restricting auto-play but any auto events. For me it was a page transition in jquerymobile which was triggered when Cordova had loaded. I switched it to being triggered by a click even and this solved the problem.