I'm using Xamarin Forms using a WebView to display content. To send commands from the webpage to the app, I'm using links with URLs like this:
myapp://command=123&someparam=456
this is then handled in the PCL project like this:
private async void CustomWebView_Navigating(object sender, WebNavigatingEventArgs e) {
if (e.Url.Contains("myapp://")) {
e.Cancel = true;
// Some app logic
}
...
This all worked well up until recently when Android phones began displaying an error page saying:
Webpage not available
ERR_Unknown_URL_Scheme
CustomWebView_Navigating is still being triggered, but how can I prevent the error page from showing?
Note: I have tried overriding ShouldOverrideUrlLoading and returning 'true' - but then CustomWebView_Navigating is no longer triggering in the PCL project.
Related
Masters,
I have a question. I've been building an Android App using WebView. Inside the app are links that navigates to external pages(I don't have any control with the WebSite that is loaded inside webview). I have an issue when I clicked a link and logCat returns : I/chromium: [INFO:CONSOLE(10)] "Uncaught TypeError: Cannot read property 'appendChild' of null" App displays white screen only. Have you experienced this issue before? Are there any possible solutions? TIA
To clarify the extent of the problem
What you currently have problem is with
Inside the app are links that navigates to external pages.
I have an
issue when I clicked a link and logCat returns
As you haven't shared your code both for webview(Android) or html code.
As I am faced similar type of problem, So these are method which solved my problems
Method 1:
public boolean shouldOverrideUrlLoading(WebView view, String urlNewString) {
view.loadUrl(urlNewString); // you are using siteView here instead of view
return true;
}
Method 2: use http in url
Make sure the url starts with http://.
Without http it will just show white screen.
I have a webview that shows ads (not my ads), the problem is when user clicks the "x" button to exit the ad, the ad still directs them to a site. What I wonder is since I can't control the ads, can I instead Disable page directing/forwarding inside webview? that means even if user clicks a link inside my webview nothing should happen.
You are looking for WebClient.shouldOverrideUrlLoading method.
webview.setWebViewClient(new WebViewClient() {
public boolean shouldOverrideUrlLoading (WebView view, String url){
//True if the host application wants to leave the current WebView and handle the url itself, otherwise return false.
return true;
}
});
I tried using shouldOverrideUrlLoading, but it didn't work. It looks like that this method is called only once when the html is loaded. After that, you click a link but the method is no more invoked.
I am also making a WebView embedding Youtube Player. Instead of forwarding ads redirect from the WebView, I prefer to open ads in a browser. So I override onLoadResource method:
#Override
public void onLoadResource(final WebView view, final String url) {
if(url.indexOf("googleadservices.")>-1){
view.getSettings().setJavaScriptEnabled(false);
view.stopLoading();
view.postDelayed(
new Runnable(){
#Override
public void run(){
Uri uri=Uri.parse(url);
Intent i=new Intent(Intent.ACTION_VIEW,uri);
i.setClassName("com.android.browser","com.android.browser.BrowserActivity");
startActivity(i);
}
}
,100
);
}
}
It worked. When I clicked the ads link, a new browser is opened in which ads site is displayed well, and the WebView was not redirected. When I push the return button, WebView show up again and I can continue watching video.
But there were still problems. If I repeat opening browser and returning to WebView for many times, the WebView might fail to block redirecting to the ads site. It is just redirected to the ads site. If I am lucky I could repeat opening and returning for 100 times. But sometimes It failed just when I repeat several times. I don't know why.
Does anyboday have any idea about how to improve it? Or is there another way to disable ads redirect?
You can build undetected webview build-id adblocker
I know it is too late for answering this question, however, for the sake of others who have the same question.
Well, you can build webview build-id adblocker, if you wish to prevent ads from loading, and provide smooth experience to the users, I am confident, because I have already implemented it in may app.
The Idea
Is to have a black list of all possible ad-serves domain name, then while webview load resources, you will prevent loading from black list domains. so it depends on how many ads-serves domain you have in the black list, fortunately, there is one website (pgl.yoyo.org/as/) which provide you with a very long list of ad-serves domai names, and listed them in many flavoures.
you can read this article for:
how to implement webview build-id adblocker
, you will build it %100 as long as you follow step by step instructions.
A summary of what we need to do:
Get the list of ad hostnames from pgl.yoyo.org.
Save the list somewhere, load it when application starts.
UseWebViewClient.shouldInterceptRequest(WebView, String) to intercept
requests.
Check if the request URL belongs to one of the hostnames in
the list and override it, returning a dummy resource instead of the
actual one, which is supposed to be ads
I have an iOS/Android app built on cordova 2.6 and jqm 1.3. I need to open a link to an external website after the user clicks on a button. The code I am using is:
var ref = window.open('http://google.com','_self','location=yes');
ref.addEventListener('loadstart',function(event) {
console.log('load started');
});
ref.addEventListener('loadstop',function(event) {
console.log('load stopped');
});
ref.addEventListener('loaderror',function(event) {
console.log('load error = ' + JSON.stringify(event));
});
On iOS everything performs like I would expect. A new browser window opens with the google website loaded. But I cannot get anything to to load in Android. When I click on the button, nothing happens. I have put in console statements before and after the window.open, so I know the code is at least being executed.
My config.xml should be wide open for white listed sites:
<access origin=".*"/>;
I have tested on a Nexus 7 (android 4.2) and an android 2.2 emulator with the same results on both.
Does anyone know why window.open would not be firing correctly on android?
It looked like it was a problem with 2.6 loading plugins on Android. I upgraded to 2.7 and everything started to work.
Perhaps it's a solution to use the ChildBrowser plugin? This gives you a bit more control over the operation itself, while still preserving platform compatibility between iOS and Android.
In most cases, I use something like the following snippet to use the childbrowser to display an external page.
function openBrowser(url) {
// determine if the childbrowser plugin is available
var useChildBrowser = ('plugins' in window && window.plugins.childBrowser);
if (useChildBrowser) {
popup = window.plugins.childBrowser;
popup.showWebPage(url, { showLocationBar: false, showAddress: false });
} else {
popup = window.open(url, 'Share', "['width=600px', 'height=400px', 'resizable=0', 'fullscreen=yes']");
}
}
Note that this falls back to using window.open if the ChildBrowser plugin isn't available, so you won't break anything else with this. Could be worth a shot, perhaps?
In a Kendo UI Mobile ListView, a script to open an external link by native browser is called when a link is clicked.
The PhoneGap script is as follow:
On Android:
navigator.app.loadUrl(link, { openExternal:true } );
On iOS:
window.open(link, '_system');
The link can be opened on the corresponding native browser.
However, when the user switch back to the app from the native browser, some problems happen.
On Android, the screen hung on the original view, when the back button is pressed again, the screen is un-freezed and can be refreshed.
On iOS, however, the screen is also hung on the original view. When tapped on the screen, the complete view (with the layout) is moved. There is no way to un-freeze this screen.
How to fix this so that the screen can be un-frezzed after switching back from the native browser to the app?
Thank you very much for your help.
Updated 1:
I changed the original tag to a tag, everythings work now. But I am still curious to see if it is certain kind of bugs for Kendo UI Mobile.
There is a serious problem with Kendo Mobile hanging the page completely, making the app totally unresponsive to touch/mouse. The offending CSS is in Loader.transition() which does this.container.css("pointer-events", "none") which is equivalent to:
document.body.style.pointerEvents = "none";
Ouch - that is ugly. Plus in _attachCapture there is offensive JavaScript for all mouse and touch events that does:
event.preventDefault();
Fatal if using an app with an embedded full page WebView/UIWebView (requiring app to be closed and restarted).
Hangs can happen if:
You have an exception in your code (even in unobvious places),
You mistype a transition (no exception, just hangs),
A user's browser doesn't fire the transitionEnd event properly for some reason (This was repeatable for one user's up-to-date Chrome browser.
There is a failure mode in the Interaction between page transitions and Loader (depending on timing, couldn't repeat),
Multiple other causes
Note that there is a comment in Kendo that says: "This should be cleaned up at some point (widget by widget), and refactored to widgets not relying on the complete callback if no transition occurs.", so clearly Telerik know there is a problem.
You can use the following code during development to at least warn when Kendo Mobile has crapped itself:
var transitionTimer;
kendo.mobile.ui.Loader.prototype.wasTransition = kendo.mobile.ui.Loader.prototype.transition;
kendo.mobile.ui.Loader.prototype.transition = function() {
transitionTimer = setTimeout(function() {
alert('Kendo has hung the page');
}, 10000);
this.wasTransition.apply(this, arguments);
}
kendo.mobile.ui.Loader.prototype.wasTransitionDone = kendo.mobile.ui.Loader.prototype.transitionDone;
kendo.mobile.ui.Loader.prototype.transitionDone = function() {
clearTimeout(transitionTimer);
this.wasTransitionDone.apply(this, arguments);
}
The webview with google search result links loaded in my android app, when I clicked on the links, it is opening up a blank screen.
I think, it is something to do with onmousedown event attached with every href links in the result page.
will be very thankful if I am provided with a way to handle this and make webview to actually openup the link that I am clicking on.
Here's another solution. After Google finishes loading the blank page you load the WebView with the previous page (which is the actual result) using the WebView's tag or a member variable. Like this:
#Override
public void onPageFinished(WebView view, String url)
{
System.out.println("onPageFinished: " + url);
if ("about:blank".equals(url) && view.getTag() != null)
{
view.loadUrl(view.getTag().toString());
}
else
{
view.setTag(url);
}
}
Here's my LogCat:
I/System.out(13182): onPageFinished: http://www.google.com/#hl=en&sugexp=les%3B&gs_rn=1&gs_ri=tablet-gws&cp=2&gs_id=9&xhr=t&q=amazon...
I/System.out(13182): onPageFinished: http://www.amazon.com/
I/System.out(13182): onPageFinished: about:blank
I/System.out(13182): onPageFinished: http://www.amazon.com/
I'm having the same problem. I get the "about:blank" page when I click on Google search results in a WebView in my Asus Transformer TF700 running 4.1.1. It doesn't happen in my Acer A100 tablet or other phones.
I noticed the result links work when I switch from Tablet to Classic version at the bottom of main Google Search Page.
https://www.google.com/?nota=1
If you remove the ?nota=1 in the above URL you won't see the Tablet option in your PC. In your tablet however the default google.com URL displays the Tablet option at the bottom.
If you use nota=1 in your search results page the links will work. Like this:
http://www.google.com/search?nota=1&q=amazon
I know this is not perfect. We'd like the default Google search results page's links to work. Google is doing something funky on the Tablet version which Asus Transformer doesn't seem to like!
I will post an update when I figure out what is causing this. Oh! the fun with Android :)
I wanted to add this as a comment to Stan Texan's answer, but I don't have enough rep points...
I'm testing on an older tablet (LG Optimus Tab/DoCoMo L-06c/T-Mobile G-Slate/Rogers LG V909) running Honeycomb (3.1) and my WebView is running into the same problem on Google's website.
Google's own browser works just fine when navigating to www.google.com, but when I use that url in a WebView in my app, the links are all "about:blank". 0_o
Therefore, if the user wants to go to Google's search page, I rewrite the url as follows:
//get the url from the user..
inUrl = urlAddressEditText.getText().toString();
// make sure it's properly formatted...
...
// then add the "/?nota=1&" if it's a Google domain.
String outUrl = inUrl.replaceFirst("(www\\.google\\..*/?)(\\??)", "$1/?nota=1&");
webView.loadView(outUrl);
So far this works, but I haven't tested it out for every scenario.
I had a look at your Vuwize app. Instead of embedding www.google.com directly into a WebView, you seem to have your own search form, run a Google search, and then render the result page yourself. This could explain your problem because result links in search results from Google is not straight href links to original pages. To understand more about your problem, it's necessary to see what exactly you're doing and how you run Google search from your server side.
If you just embed www.google.com in a WebView directly like this:
setContentView(R.layout.main);
mWebView = (WebView) findViewById(R.id.webview);
mWebView.getSettings().setJavaScriptEnabled(true);
mWebView.loadUrl("http://www.google.com");
mWebView.setWebViewClient(new HelloWebViewClient());
Users can enter search directly into Google and get result pages, where links are all clickable in the same WebView.
Here's another solution to handle blank pages caused in Jelly Bean. I found 2 URLs that cause blank pages. Override loadUrl(String) and not load them at all.
#Override
public void loadUrl(String url)
{
if (url != null && !(url.startsWith("file:///android_asset") || "about:blank".equals(url)))
{
super.loadUrl(url);
}
}