I have a WebView which may contain data that appears to be getting "auto linked". Something that looks like an email address is becoming clickable, even though it's now within an <a> tag or has an onclick attribute. How do I disable this auto-linking?
I've looked thorugh the WebView docs, as well as the WebSettings docs, but didn't seem to see anything that mentions this behavior.
alt text http://beautifulpixel.com/assets/5554_Fast-20100706-110228.png
I know this is a bit late, but for future reference, this might be a solution that will work regardless if the links are auto created or defined in the <a>-tag.
myWebView.setWebViewClient(new WebViewClient(){
#Override
public boolean shouldOverrideUrlLoading(WebView view, String url) {
// return true; // will disable all links
// disable phone and email links
if(url.startsWith("mailto") || url.startsWith("tel")) {
return true;
}
// leave the decision to the webview
return false;
}
});
To do all the email addresses, add a meta tag:
<meta name="format-detection" content="email=no" />
You can also disable physical address and telephone detection:
<meta name="format-detection" content="telephone=no" />
<meta name="format-detection" content="address=no" />
In my own application, though, I needed PhD's solution to prevent only one email from being linked.
I had the same problem, tried this:
<a onClick=\"return false;\">jorgesys#elnorte.com</a>
it did not worked.
Then tried this:
<a href='javascript:void(0);'>800-644-9737</a>
and it did the trick
Hi Squeaggy why you do want to eliminate that funcionality from the webview, but well a tricky way would be including onClick="return false;" in the anchor tag that contains the email or URL.
<a onClick=\"return false;\">jorgesys#elnorte.com</a>
That appears to be unchangeable functionality of the WebView.
You could do the opposite of this Is there any way to have WebView auto-link URLs and phone numbers in Android? and create a javascript link stripper (instead of the proposed link injector there).
Not sure what else would work for this.
Related
I getting the below error when trying to load some webpages
Error parsing a meta element's content: ';' is not a valid key-value pair separator. Please use ',' instead.
How do I solve it?
If you are using webview.loadUrl() method to load a web page make sure that elements in the content attribute in meta tag (of web page's html) should have its elements comma "," separated neither semi-colon ";" nor blank space, for example:
Like this:
<meta name="viewport" content="key1=value1,key2=value2,key3=value3"> //best practice
Not even this, though supported but not recommended:
<meta name="viewport" content="key1=value1;key2=value2;key3=value3">
Not even this, though supported but not recommended:
<meta name="viewport" content="key1=value1;key2=value2;key3=value3">
So, see meta tag in your html's head tag having name="viewport", it should have it elements (i.e. key=values) comma separated in its content attribute, so after fixing it should like this:
<head>
...
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1">
....
</head>
Ref: https://developer.mozilla.org/en-US/docs/Mozilla/Mobile/Viewport_meta_tag
Also see this similar thread: Android Webview - Scale image to fit screen properly with one loadUrl
I was able to solve this issue by implementing the below code:
webView_courseLesson.settings.javaScriptEnabled = true
webView_courseLesson.settings.loadWithOverviewMode = true
webView_courseLesson.settings.useWideViewPort = true
By default the javaScript support is turned off by the Android framework. Though you can check documentation here http://developer.android.com/guide/practices/security.html
In my app, I show an external HTML site in either a CustomTabsIntent or a in a WebView:
if (customTabsIntent != null) customTabsIntent.launchUrl(this, Uri.parse("http://some.where.com/site.html"));
else startActivity(new Intent(Intent.ACTION_VIEW, Uri.parse("http://some.where.com/site.html")));
But the style of that HTML is already updated, but my smartphone shows the old style (old fonts etc.).
In the *.html file there is a *.css referenced:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href='https://my.site.com/assets/css/style.css' rel='stylesheet' type='text/css'>
</head>
And in that *.css file, there is an individual font referenced; e.g.:
#font-face {
font-family: 'MyFontRegular';
src: url('https://www.openfont.org/assets/mail/fonts/MyFontWeb-Regular.woff') format('woff'),
url('https://www.openfont.org/assets/mail/fonts/MyFontWeb-Regular.eot') format('embedded-opentype');
}
As I said, the chrome browser in my smartphone does not show the referenced fonts, because it cuts the http:// or https:// off.
When I prepend that scheme manually into the address bar, the proper style is being shown.
How can I force the https:// scheme in the address field in my android browser, when it was called from my android app ?
It could be cache. If you have control over the html site, change the include to something like:
<link href='https://my.site.com/assets/css/style.css?something=132545' rel='stylesheet' type='text/css'>
After that, try it on the phone. If the cache clears up and pulls the new css file, change the number to a random generated number.
It will load the file each time the "something" variable changes.
If you perform those style updates not so often, make it a fixed number, and keep increasing it each time you update the css file.
Following your information on the fonts not being loaded with https, you could try to override the onReceivedSslError and see it solves the problem:
#Override
public void onReceivedSslError(WebView view, SslErrorHandler handler,
SslError error) {
handler.proceed();
}
Be careful, this completely disables ssl validation... it´s a dangerous route.
I have a WebView in my app that has a form in the HTML with editable text fields. When the user taps on one of these fields, the WebView zooms in slightly, which I don't want. This only happens in Android 4.4 because of how I'm scaling the WebView for older versions (see code below).
I've seen Disable zoom when clicking on form fields within a WebView?, which addresses my question for older Android versions, solving the problem using WebSettings.setDefaultZoom(ZoomDensity.FAR), but that setting is deprecated in 4.4. Even still, I've tried a variety of combinations including setting this property, and my WebView still gets zoomed in.
Code creating the WebView:
public View createView(float parentWidth) {
mWebView = new ObservableWebView(mContext);
mWebView.getSettings().setJavaScriptEnabled(true);
//Listener for Console Messages
mWebView.setWebChromeClient(new MyWebChromeClient());
if (Build.VERSION.SDK_INT < Build.VERSION_CODES.KITKAT){
mWebView.setInitialScale(Globals.convertDpToPx(100));
} else{
WebSettings settings = mWebView.getSettings();
settings.setSupportZoom(false);
settings.setBuiltInZoomControls(false);
settings.setDisplayZoomControls(false);
}
loadURL();
return mWebView;
}
public void loadURL() {
mWebView.clearHistory();
mWebView.removeAllViews();
mWebView.loadUrl(mData.getUrl());
}
Thanks in advance for any help.
You could add to the head of your HTML page the tag:
<meta name="viewport" content="user-scalable=no, width=device-width">
And, if you can't change the original HTML, you can alter it running a bit of JavaScript code after the page has been loaded in your WebViewClient. Something like:
#Override
public void onPageFinished(WebView view, String url) {
view.loadUrl("javascript:"
+ "var newMeta = document.createElement('meta');"
+ "newMeta.setAttribute('name', 'viewport');"
+ "newMeta.setAttribute('content', 'user-scalable=no, width=device-width');"
+ "document.getElementsByTagName('head')[0].appendChild(newMeta);"
);
super.onPageFinished(view, url);
}
I've tested it on a Samsung Galaxy Tab 4 10.1 running KitKat. On other devices this code causes some side effects, so it's better to execute it only if you are on KitKat or higher.
Have you tried disabling zoom by setting a viewport meta tag?
<meta name="viewport" content="width=device-width, user-scalable=no">
You need to call settings.setUseWideViewport(true); for that to take effect.
I'm looking to pass some config data from a webview to an app. I think the best way to do this is to link to a file that contains all the information. What's the best way to add the link to the web view page?
Is something like:
<head>
<meta name="my-app-config" content="http://my-app-ulr.com/config.xml">
</head>
Appropriate for the app to read? Or should I use a custom element in the header where I can pass more data if needed, such as:
<head>
<my-app type="config">http://my-app-ulr.com/config.xml"</my-app>
</head>
Is there an advantage of one versus the other for reading the web view content from the app?
I did this previously with meta tags, no issues to report yet. However, I structured it in this way:
<meta name="my-app-properties" content="things of interest to my app" my-app-config="http://my-app-ulr.com/config.xml" my-other-property="more things">
This seems more readable to me and gives you room to add and read more properties easily
I'm trying to build a simple localStorage example using android webview. I'm having some trouble when i close the app. Everytime i start the app, values stored in localStorage disappear. I googled it and couldn't find a proper solution. Here I put my HTML, Java, Manifest code samples. Any help will be appreciated.
HTML :
<!DOCTYPE html>
<html>
<head>
<script>
function clickCounter()
{
if(typeof(Storage)!=="undefined")
{
if (localStorage.clickcount)
{
localStorage.clickcount=Number(localStorage.clickcount)+1;
}
else
{
localStorage.clickcount=1;
}
document.getElementById("result").innerHTML="You have clicked the button " + localStorage.clickcount + " time(s).";
}
else
{
document.getElementById("result").innerHTML="Sorry, your browser does not support web storage...";
}
}
</script>
</head>
<body>
<p><button onclick="clickCounter()" type="button">Click me!</button></p>
<div id="result"></div>
<p>Click the button to see the counter increase.</p>
<p>Close the browser tab (or window), and try again, and the counter will continue to count (is not reset).</p>
</body>
</html>
JAVA:
webView.getSettings().setJavaScriptEnabled(true);
webView.getSettings().setDomStorageEnabled(true);
webView.getSettings().setDatabaseEnabled(true);
webView.getSettings().setDatabasePath(this.getApplicationContext().getDir("database", Context.MODE_PRIVATE).getPath());
webView.loadUrl("http://www.example.com/sample.html");
setContentView(webView);
MANIFEST:
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
Permission lines are placed under tag but outside the tag
and here is the scenario:
-turn off the internet connection of the mobile device
-start the app
-open the page inside the webview
-tap the button several times
-close the app (close it inside the task manager)
-turn on the internet connection of the mobile device
-start the app
-open the page
-tap button several times and it counts from beginning
you can create different scenarios while trying. The main problem is how to set the webView to use localStorage properly?There is something that i'm missing about webview.(this error does not occur when you try it on the chrome browser or any other browser)
This seems like a bug of webview. I was actually trying to open 3 different pages inside a webview and I was loosing localStorage data. I splitted this activity into 3 activities that each of them opens only one page. And the problem disappeared.