I used this code and working but it first loads with website header and then afterward loads without header.
What is wrong in this code? What to modify so that only one screen loads, i.e, without website header?
webSettings.setJavaScriptEnabled(true);
webView.setWebViewClient(new WebViewClient()
{
#Override
public void onPageFinished(WebView view, String url)
{
webView.loadUrl("javascript:(function() { " +
"var head = document.getElementsByTagName('header')[0];"
+ "head.parentNode.removeChild(head);" +
"})()");
webView.loadUrl("javascript:(function() { " +
"var head = document.getElementsByTagName('footer')[0];"
+ "head.parentNode.removeChild(head);" +
"})()");
}
});
webView.loadUrl("https://www.google.com");
I resolved by putting this code in OnLoadResource() method instead of OnPageFinished() and using evaluateJavascript:
override fun onLoadResource(view: WebView?, url: String?) {
webView.evaluateJavascript("javascript:(function() { " +
"var head = document.getElementsByTagName('footer')[0];"
+ "head.parentNode.removeChild(head);" +
"})()", {});
}
Related
I'm trying to develop android app using webview and JavaScriptInterface like this.
private static final String ENTRY_URL = "https://www.google.com";
mWebView.setWebViewClient(new WebViewClient() {
...
#Override
public void onPageFinished(WebView view, String url) {
if (url.equals(ENTRY_URL)) {
String keyword = "tistory";
String script = "javascript:function afterLoad() {"
+ "document.getElementById('keyword').value = '" + keyword + "';"
+ "document.forms[0].setAttribute('onsubmit', 'window.Zeany.justDoIt(elements[0].value); return true;');"
+ "};"
+ "afterLoad();";
view.loadUrl(script);
}
}
}
when I call method (mwebview.load("https://www.google.com")), I want to load only html file. Beacuse of Download Speed
I need only html, not css,png. when download all resources, webview load speed is too slow.
I really want to get only html. How to I achieve this goal?
Using this code you should be able to do that.
WebSettings settings = webview.getSettings();
settings.setBlockNetworkLoads(true);
settings.setBlockNetworkImage(true);
settings.setJavaScriptEnabled(false);
I am trying to make WebView display remote image (with certain stylistic tweaks). This works perfectly by loading WebView with an HTML snippet that references that remote IMG amongst other things. But the only problem is that sometimes this remote image is not present which results in a broken image icon.
What I would like to do is to intercept the (un)availability of the remote image and recover by switching to another one. I've tried using onReceivedError() of WebViewClient but somehow it does not trigger even when the image is not available.
My current image loading logic is as follows:
String url = "..."; // remote image URL
String html = String.format("<style>img{display: inline;" +
"height: auto;max-width: 100%%;}</style>" +
"<img src=\"%s\"></img>", url);
wv.setWebViewClient(new WebViewClient() {
#Override
public void onReceivedError(WebView view, WebResourceRequest req,
WebResourceError rerr) {
Log.e("WEB_VIEW_TEST", "error code: " + errorCode);
}
});
wv.loadData(html, "text/html", null);
I suspect onReceivedError() only triggers for page-level errors and I'm not sure how to make it trigger for element-level errors. Any help would be very appreciated.
PS. While typing this, I've just thought about handling it in JS - that is, load webview with a JS snippet that tries to load the remote image and in case of an error loads another one - all within the JavaScript realm. I'll try it and if it works will post it here as well.
OK, the JavaScript solution works, although the question about intercepting in Android real still remains. Here's the JavaScript way:
String url = "..."; // real image
String backup_url = "..."; // backup image
WebView wv = (WebView) findViewById(R.id.fullImageWebView);
WebSettings webSettings = wv.getSettings();
webSettings.setJavaScriptEnabled(true);
// FIXME: put into assets as an HTML file
String template = "" +
"<style>\n" +
" img {\n" +
" display: inline;\n" +
" height: auto;\n" +
" max-width: 100%%;\n" +
" }\n" +
"</style>\n" +
"\n" +
"<img id='image'></img>\n" +
"\n" +
"<script>\n" +
" var second_attempt = false;\n" +
" var img = document.getElementById('image');\n" +
" img.src = '%s';\n" +
"\n" +
" window.addEventListener('error', function(e) {\n" +
" if (!second_attempt) {\n" +
" second_attempt = true;\n" +
" img.src = '%s';\n" +
" }\n" +
" }, true);\n" +
"</script>";
String html = String.format(template, url, backup_url);
wv.loadData(html, "text/html", null);
I am using an android WebView and I want to load webpage on my android device but display only some parts of webpage, not the whole page.
Is this possible?
I think what you want to do is remove some content from your HTML page and then display it in the WebView. This is possible via javascript so just before you display the page add some javascript code that will remove the elements you don't want.
LIKE
final WebView mWebView = (WebView) findViewById(R.id.mWebViewId);
mWebView.getSettings().setJavaScriptEnabled(true);
mWebView.setWebViewClient(new WebViewClient() {
#Override
public void onPageFinished(WebView view, String url)
{
mWebView.loadUrl("javascript:(function() { " +
"document.getElementById('tableid')[0].style.display='none'; " +
"})()");
}
});
mWebView.loadUrl(youUrl);
Just replace document.getElementsByTagName('tableid') with document.getElementsByTagName('theElementYouWantToRemove') for every element and you're set. Original solution can be found at Display a part of the webpage on the webview android
for those who still looking for a solution:
WebView webView = findViewById(R.id.webview);
webView.getSettings().setJavaScriptEnabled(true);
webView.setWebViewClient(new WebViewClient() {
#Override
public void onPageFinished(WebView view, String url)
{
mWebView.loadUrl("javascript:(function() { " +
"document.getElementsByClassName('className1')[0].remove();
document.getElementsByClassName('className2')[0].remove();
document.getElementsByClassName('className3')[0].remove();" +
"})()");
}
});
webView.loadUrl(url);
In Kotlin in this way:
view.webViewClient = object : WebViewClient() {
override fun onPageFinished(view: WebView, url: String) {
view.loadUrl(
"javascript:(function() { " +
"var head = document.getElementsByClassName('header')[0].style.display='true'; " +
"var head = document.getElementsByClassName('art-bnr')[0].style.display='none'; " +
"var head = document.getElementsByClassName('container-box')[0].style.display='none'; " +
"var head = document.getElementsByClassName('blog-sidebar')[0].style.display='none'; " +
"var head = document.getElementsByClassName('footer-container')[0].style.display='none'; " +
"})()"
) } }
view.loadUrl(url)
i need to display another website into my android webview without it's header and footer
wb.setWebViewClient(new WebViewClient() {
#Override
public void onPageFinished(WebView view, String url)
{
wb.loadUrl("javascript:(function() { " +"document.getElementsByTagName('header')[0].style.display=\"none\"; " + "})()");
}
});
wb.loadUrl(url);
setContentView(wb);
Why not use iframe?
Try something like this -
String iframe = "<iframe scrolling=\"no\" src=\"YOUR URL\"" +
"width=\"400px\" height=\"300\"></iframe>";
webview.getSettings().setJavaScriptEnabled(true); //be sure to enable this or
//page might not load properly
webview.loadDataWithBaseURL("", iframe, "text/html", "UTF-8", "");
//loading iframe
You can customize the iframe code according to your needs. Be sure to add \ before every " in your HTML Code.
I've problem with adding Javscript BEFORE page starts to load. I tried to do something like this:
#Override
public void onPageStarted(WebView view, String url, Bitmap favicon) {
super.onPageStarted(view, url, favicon);
browser.loadUrl("javascript:alert(window.prepended = 'abc - "+url+"');");
}
Or:
#Override
public void onLoadResource(WebView view, String url) {
super.onLoadResource(view, url);
browser.loadUrl("javascript:alert(window.prepended = 'abc - "+url+"');");
}
But after first time (when I click Reload) I'm getting undefined in JS:
<script type="text/javascript">
alert(window.prepended);
setTimeout("alert('Timeout: '+window.prepended)", 2000);
</script>
Reload
Edit:
Finally I used onProgressChanged function from WebChromeClient :)
Try something like this in onPageStarted() method:
/*
* This call injects JavaScript into the page replacing the page
* content
*/
webView.loadUrl(injectJavaScriptIntoErrorPage());
/**
* Method used to inject custom JavaScript code into HTML page.
*
* #return String of JavaScript function Called in onReceivedError method
* for myWebClient
*/
protected String injectJavaScriptIntoErrorPage() {
String errorPage = "javascript:(function() { "
+ "document.getElementsByTagName('style')[0].innerHTML = ' "
+ " body { margin:auto;width:500px;text-align:center; }"
+ " p { font-size:20px; }'; "
+ "document.getElementsByTagName('body')[0].innerHTML = ' "
+ " <img src=\"file:///android_asset/custom_error.png\"/>"
+ " <p>Venter på nettet.</p>" + "';})()";
return errorPage;
}
The method above modifies the current page and it will display an custom error page instead of the default one.
I was calling this in on onReceivedError(), but you can you use it in onPageStarted() and add your custom javascript function.
This is just to give you an idea on how you can manipulate the current page.
Best regards.