近日畜侦，在把某網(wǎng)站用WebView打包到App里面的時候元扔，出現(xiàn)的一個麻煩⌒牛看下圖
廣告
額澎语，有廣告。不影響閱讀體驗的廣告都是可以接受的验懊。但是有一問題是因為有一個廣告div比屏幕要大擅羞，導致該網(wǎng)頁在在移動端上可以左右滑動，這個就沒法忍受了义图，看下圖
廣告
沒辦法了减俏，只能把廣告去掉了.
首先看看集成網(wǎng)頁的代碼.
private WebView webView;
private WebSettings settings;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
this.setContentView(R.layout.activity_main);
webView = (WebView) findViewById(web);
//設置WebView屬性，能夠執(zhí)行Javascript腳本
settings = webView.getSettings();
settings.setJavaScriptEnabled(true);
settings.setAppCacheEnabled(true);
webView.setWebViewClient(new NoAdWebViewClient());
//加載需要顯示的網(wǎng)頁
webView.loadUrl("http://champion.gg/");
}
為了支持離線瀏覽歌溉，打開了WebView的默認緩存垄懂，設置支持js支持,設置WebClient，這里的NoAdWebViewClient在下面可以看到痛垛，在WebViewClient里面去掉廣告.
@Override
//設置回退
//覆蓋Activity類的onKeyDown(int keyCoder,KeyEvent event)方法
public boolean onKeyDown(int keyCode, KeyEvent event) {
if ((keyCode == KeyEvent.KEYCODE_BACK) && webView.canGoBack()) {
webView.goBack(); //goBack()表示返回WebView的上一頁面
return true;
}
return false;
}
重寫Activity的onKeyDown簡單back案件草慧，當網(wǎng)頁可以back的時候讓網(wǎng)頁回到上一頁面.
來看一下NoAdWebViewClient的關鍵代碼:
繼承系統(tǒng)的WebViewClient，然后重寫onPageFinished方法匙头。
package com.jelly.championgg;
import android.content.Context;
import android.graphics.Bitmap;
import android.os.Handler;
import android.os.Message;
import android.webkit.WebView;
import android.webkit.WebViewClient;
/**
* Created by BrainWang on 05/01/2016.
*/
public class NoAdWebViewClient extends WebViewClient {
private Context context;
public NoAdWebViewClient(Context context) {
this.context = context;
}
@Override
public void onPageFinished(WebView view, String url) {
super.onPageFinished(view, url);
String js = ADFilterTool.getClearAdDivJs(context);
Log.v("adJs",js);
view.loadUrl(js);
}
}
在onPageFinished里面外面執(zhí)行的了一段Js,來看一看這段js（以下js為了方便閱讀漫谷，經過整理）：
javascript:
var adDiv0= document.getElementById('div-gpt-ad-1443488528500-4');
if(adDiv0 != null)
adDiv0.parentNode.removeChild(adDiv0);
var adDiv1= document.getElementById('div-gpt-ad-1443727656867-1');
if(adDiv1 != null)
adDiv1.parentNode.removeChild(adDiv1);
var adDiv2= document.getElementById('div-gpt-ad-1443488528500-5');
if(adDiv2 != null)
adDiv2.parentNode.removeChild(adDiv2);
...
去掉廣告的原理很簡單，注入一段js把顯示廣告的div刪除就ok了蹂析，來看一下生成js的代碼:
public static String getClearAdDivJs(Context context){
String js = "javascript:";
Resources res = context.getResources();
String[] adDivs = res.getStringArray(R.array.adBlockDiv);
for(int i=0;i<adDivs.length;i++){
js += "var adDiv"+i+"= document.getElementById('"+adDivs[i]+"');if(adDiv"+i+" != null)adDiv"+i+".parentNode.removeChild(adDiv"+i+");";
}
return js;
}
通過arrays.xml去管理去要去掉的廣告div舔示，遍歷廣告divId的集合，組合成一段js代碼电抚，注入到網(wǎng)頁中去掉廣告.
<?xml version="1.0" encoding="utf-8"?>
<resources>
<string-array name="adBlockDiv">
<item>div-gpt-ad-1443488528500-4</item>
<item>div-gpt-ad-1443727656867-1</item>
<item>div-gpt-ad-1443488528500-5</item>
<item>div-gpt-ad-1443488528500-6</item>
<item>div-gpt-ad-1443488528500-7</item>
<item>div-gpt-ad-1443727656867-0</item>
<item>div-gpt-ad-1443488528500-2</item>
<item>div-gpt-ad-1443488528500-3</item>
<item>div-gpt-ad-1443488528500-1</item>
</string-array>
</resources>
那么這些廣告div的Id是如何獲取的呢惕稻？我們通過Chrome瀏覽器可以很方便的獲取到這些Id,可以看到通過F12的調試模式可以輕易的獲取到廣告div的Id
獲取廣告ID
完成后我們就可以看到沒有廣告的頁面了，完成效果蝙叛。
最后效果
其實這里還有一個問題俺祠，當網(wǎng)絡比較慢的情況下，我們的網(wǎng)頁會一直加載借帘，然后當還沒有調用onPageFinished的時候蜘渣，用戶就已經開始操作了，所以我們可以優(yōu)化一下這種方式：
package com.jelly.championgg;
import android.content.Context;
import android.graphics.Bitmap;
import android.os.Handler;
import android.os.Message;
import android.util.Log;
import android.webkit.WebView;
import android.webkit.WebViewClient;
/**
* Created by BrainWang on 05/01/2016.
*/
public class NoAdWebViewClient extends WebViewClient {
private Context context;
private WebView webView;
private boolean isClose;
public NoAdWebViewClient(Context context,WebView webView) {
this.context = context;
this.webView = webView;
}
@Override
public void onPageStarted(WebView view, String url, Bitmap favicon) {
super.onPageStarted(view, url, favicon);
if(isClose){ //如果線程正在運行就不用重新開啟一個線程了
return;
}
new Thread(new Runnable() {
@Override
public void run() {
isClose = true;
while (isClose){
try {
Thread.sleep(1000);
} catch (InterruptedException e) {
e.printStackTrace();
}
handler.sendEmptyMessage(0x001);
}
}
}).start();
}
Handler handler = new Handler(){
@Override
public void handleMessage(Message msg) {
String js = ADFilterTool.getClearAdDivJs(context);
Log.v("adJs",js);
webView.loadUrl(js);
}
};
@Override
public void onPageFinished(WebView view, String url) {
super.onPageFinished(view, url);
isClose = false;
}
}
在NoAdWebViewClient里面我們重寫onPageStarted方法肺然，并且開啟一個線程蔫缸，每1秒的循環(huán)注入js，在這里由于不能在子線程里面操作WebView际起，所以利用Handler去注入js.并且在onPageFinished內關閉線程.這樣之后拾碌，即使網(wǎng)絡很慢吐葱，在沒有回調onPageFinished的時候，也不會出現(xiàn)廣告了倦沧。
