x5開源庫後續知識點
目錄介紹
- 01.基礎使用目錄介紹
- 1.0.1 經常使用的基礎介紹
- 1.0.2 Android調用Js
- 1.0.3 Js調用Android
- 1.0.4 WebView.loadUrl(url)流程
- 1.0.5 js的調用時機分析
- 1.0.6 清除緩存數據方式有哪些
- 1.0.7 如何使用DeepLink
- 1.0.8 應用被做爲第三方瀏覽器打開
- 02.優化彙總目錄介紹
- 2.0.1 視頻全屏播放按返回頁面被放大
- 2.0.2 加快加載webView中的圖片資源
- 2.0.3 自定義加載異常error的狀態頁面
- 2.0.4 WebView硬件加速致使頁面渲染閃爍
- 2.0.5 WebView加載證書錯誤
- 2.0.6 web音頻播放銷燬後還有聲音
- 2.0.7 DNS採用和客戶端API相同的域名
- 2.0.8 如何設置白名單操做
- 2.0.9 後臺沒法釋放js致使發熱耗電
- 2.1.0 能夠提早顯示加載進度條
- 2.1.1 WebView密碼明文存儲漏洞優化
- 03.問題彙總目錄介紹
- 3.0.0 WebView進化史介紹
- 3.0.1 提早初始化WebView必要性
- 3.0.2 x5加載office資源
- 3.0.3 WebView播放視頻問題
- 3.0.4 沒法獲取webView的正確高度
- 3.0.5 使用scheme協議打開連接風險
- 3.0.6 如何處理加載錯誤
- 3.0.7 webView防止內存泄漏
- 3.0.8 關於js注入時機修改
- 3.0.9 視頻/圖片寬度超過屏幕
- 3.1.0 如何保證js安全性
- 3.1.1 如何代碼開啓硬件加速
- 3.1.2 WebView設置Cookie
- 3.1.4 webView加載網頁不顯示圖片
- 3.1.5 繞過證書校驗漏洞
- 3.1.6 allowFileAccess漏洞
- 3.1.7 WebView嵌套ScrollView問題
- 3.1.8 WebView中圖片點擊放大
- 3.1.9 頁面滑動期間不渲染/執行
- 3.2.0 被運營商劫持和注入問題
- 3.2.1 解決資源加載緩慢問題
- 3.2.2 判斷是否已經滾動到頁面底端
- 3.2.3 使用loadData加載html亂碼
- 3.2.4 WebView下載進度沒法監聽
- 3.2.5 webView出現302/303重定向
x5封裝庫YCWebView開源項目地址
- github.com/yangchong21…
- 該後續知識點，幾乎包含了實際開發中絕大多數的問題，再次學習和鞏固webView，但願這篇文章對你有用……更多內容，能夠看個人開源項目，若是以爲給你帶來一些收穫，麻煩star一下，這也能夠增長開發者開源項目的動力！
01.基礎使用目錄介紹
1.0.1 經常使用的基礎介紹
- 在activity中最簡單的使用
webview.loadUrl("http://www.baidu.com/"); //加載web資源 //webView.loadUrl("file:///android_asset/example.html"); //加載本地資源 //這個時候發現一個問題，啓動應用後，自動的打開了系統內置的瀏覽器，解決這個問題須要爲webview設置 WebViewClient，並重寫方法： webview.setWebViewClient(new WebViewClient(){ @Override public boolean shouldOverrideUrlLoading(WebView view, String url) { view.loadUrl(url); //返回值是true的時候控制去WebView打開，爲false調用系統瀏覽器或第三方瀏覽器 return true; } //還能夠重寫其餘的方法 }); 複製代碼 - 那些因素影響頁面加載速度
- 影響頁面加載速度的因素有很是多，在對 WebView 加載一個網頁的過程進行調試發現
- 每次加載的過程當中都會有較多的網絡請求，除了 web 頁面自身的 URL 請求
- 有 web 頁面外部引用的JS、CSS、字體、圖片等等都是個獨立的http請求。這些請求都是串行的，這些請求加上瀏覽器的解析、渲染時間就會致使 WebView 總體加載時間變長，消耗的流量也對應的真多。
- 影響頁面加載速度的因素有很是多，在對 WebView 加載一個網頁的過程進行調試發現
1.0.2 Android調用Js
- 第一種方式：native 調用 js 的方法，方法爲：
- 注意的是名字必定要對應上，要否則是調用不成功的，並且還有一點是 JS 的調用必定要在 onPageFinished 函數回調以後才能調用，要否則也是會失敗的。
//java //調用無參方法 mWebView.loadUrl("javascript:callByAndroid()"); //調用有參方法 mWebView.loadUrl("javascript:showData(" + result + ")"); //javascript，下面是對應的js代碼 <script type="text/javascript"> function showData(result){ alert("result"=result); return "success"; } function callByAndroid(){ console.log("callByAndroid") showElement("Js:無參方法callByAndroid被調用"); } </script> 複製代碼 - 第二種方式：
- 若是如今有需求，咱們要獲得一個 Native 調用 Web 的回調怎麼辦，Google 在 Android4.4 爲咱們新增長了一個新方法，這個方法比 loadUrl 方法更加方便簡潔，並且比 loadUrl 效率更高，由於 loadUrl 的執行會形成頁面刷新一次，這個方法不會，由於這個方法是在 4.4 版本才引入的，因此使用的時候須要添加版本的判斷：
if (Build.VERSION.SDK_INT < 18) { mWebView.loadUrl(jsStr); } else { mWebView.evaluateJavascript(jsStr, new ValueCallback<String>() { @Override public void onReceiveValue(String value) { //此處爲 js 返回的結果 } }); } 複製代碼 - 兩種方式的對比
- 通常最常使用的就是第一種方法，可是第一種方法獲取返回的值比較麻煩，而第二種方法因爲是在 4.4 版本引入的，因此侷限性比較大。
- 注意問題
- 記得添加ws.setJavaScriptEnabled(true)代碼
1.0.3 Js調用Android
- 第一種方式：經過 addJavascriptInterface 方法進行添加對象映射
- 這種是使用最多的方式了，首先第一步咱們須要設置一個屬性：
mWebView.getSettings().setJavaScriptEnabled(true); 複製代碼- 這個函數會有一個警告，由於在特定的版本之下會有很是危險的漏洞，設置完這個屬性以後，Native須要定義一個類：
- 在 API17 版本以後，須要在被調用的地方加上 @addJavascriptInterface 約束註解，由於不加上註解的方法是沒有辦法被調用的
public class JSObject { private Context mContext; public JSObject(Context context) { mContext = context; } @JavascriptInterface public String showToast(String text) { Toast.show(mContext, text, Toast.LENGTH_SHORT).show(); return "success"; } /** * 前端代碼嵌入js： * imageClick 名應和js函數方法名一致 * * @param src 圖片的連接 */ @JavascriptInterface public void imageClick(String src) { Log.e("imageClick", "----點擊了圖片"); } /** * 網頁使用的js，方法無參數 */ @JavascriptInterface public void startFunction() { Log.e("startFunction", "----無參"); } } //特定版本下會存在漏洞 mWebView.addJavascriptInterface(new JSObject(this), "yc逗比"); 複製代碼- JS 代碼調用
- 這種方式的好處在於使用簡單明瞭，本地和 JS 的約定也很簡單，就是對象名稱和方法名稱約定好便可，缺點就是要提到的漏洞問題。
function showToast(){ var result = myObj.showToast("我是來自web的Toast"); } function showToast(){ myObj.imageClick("圖片"); } function showToast(){ myObj.startFunction(); } 複製代碼 - 第二種方式：利用 WebViewClient 接口回調方法攔截 url
- 這種方式其實實現也很簡單，使用的頻次也很高，上面介紹到了 WebViewClient ，其中有個回調接口 shouldOverrideUrlLoading (WebView view, String url)) ，就是利用這個攔截 url，而後解析這個 url 的協議，若是發現是咱們預先約定好的協議就開始解析參數，執行相應的邏輯。注意這個方法在 API24 版本已經廢棄了，須要使用 shouldOverrideUrlLoading (WebView view, WebResourceRequest request)) 替代，使用方法很相似，咱們這裏就使用 shouldOverrideUrlLoading (WebView view, String url)) 方法來介紹一下：
- 代碼很簡單，這個方法能夠攔截 WebView 中加載 url 的過程，獲得對應的 url，咱們就能夠經過這個方法，與網頁約定好一個協議，若是匹配，執行相應操做。
public boolean shouldOverrideUrlLoading(WebView view, String url) { //假定傳入進來的 url = "js://openActivity?arg1=111&arg2=222"，表明須要打開本地頁面，而且帶入相應的參數 Uri uri = Uri.parse(url); String scheme = uri.getScheme(); //若是 scheme 爲 js，表明爲預先約定的 js 協議 if (scheme.equals("js")) { //若是 authority 爲 openActivity，表明 web 須要打開一個本地的頁面 if (uri.getAuthority().equals("openActivity")) { //解析 web 頁面帶過來的相關參數 HashMap<String, String> params = new HashMap<>(); Set<String> collection = uri.getQueryParameterNames(); for (String name : collection) { params.put(name, uri.getQueryParameter(name)); } Intent intent = new Intent(getContext(), MainActivity.class); intent.putExtra("params", params); getContext().startActivity(intent); } //表明應用內部處理完成 return true; } return super.shouldOverrideUrlLoading(view, url); } 複製代碼- JS 代碼調用
function openActivity(){ document.location = "js://openActivity?arg1=111&arg2=222"; } 複製代碼- 存在問題：這個代碼執行以後，就會觸發本地的 shouldOverrideUrlLoading 方法，而後進行參數解析，調用指定方法。這個方式不會存在第一種提到的漏洞問題，可是它也有一個很繁瑣的地方是，若是 web 端想要獲得方法的返回值，只能經過 WebView 的 loadUrl 方法去執行 JS 方法把返回值傳遞回去，相關的代碼以下：
//java mWebView.loadUrl("javascript:returnResult(" + result + ")"); //javascript function returnResult(result){ alert("result is" + result); } 複製代碼 - 這種方式其實實現也很簡單，使用的頻次也很高，上面介紹到了 WebViewClient ，其中有個回調接口 shouldOverrideUrlLoading (WebView view, String url)) ，就是利用這個攔截 url，而後解析這個 url 的協議，若是發現是咱們預先約定好的協議就開始解析參數，執行相應的邏輯。注意這個方法在 API24 版本已經廢棄了，須要使用 shouldOverrideUrlLoading (WebView view, WebResourceRequest request)) 替代，使用方法很相似，咱們這裏就使用 shouldOverrideUrlLoading (WebView view, String url)) 方法來介紹一下：
- 第三種方式：利用 WebChromeClient 回調接口的三個方法攔截消息
- 這個方法的原理和第二種方式原理同樣，都是攔截相關接口，只是攔截的接口不同：
@Override public boolean onJsAlert(WebView view, String url, String message, JsResult result) { return super.onJsAlert(view, url, message, result); } @Override public boolean onJsConfirm(WebView view, String url, String message, JsResult result) { return super.onJsConfirm(view, url, message, result); } @Override public boolean onJsPrompt(WebView view, String url, String message, String defaultValue, JsPromptResult result) { //假定傳入進來的 message = "js://openActivity?arg1=111&arg2=222"，表明須要打開本地頁面，而且帶入相應的參數 Uri uri = Uri.parse(message); String scheme = uri.getScheme(); if (scheme.equals("js")) { if (uri.getAuthority().equals("openActivity")) { HashMap<String, String> params = new HashMap<>(); Set<String> collection = uri.getQueryParameterNames(); for (String name : collection) { params.put(name, uri.getQueryParameter(name)); } Intent intent = new Intent(getContext(), MainActivity.class); intent.putExtra("params", params); getContext().startActivity(intent); //表明應用內部處理完成 result.confirm("success"); } return true; } return super.onJsPrompt(view, url, message, defaultValue, result); } 複製代碼- 和 WebViewClient 同樣，此次添加的是WebChromeClient接口，能夠攔截JS中的幾個提示方法，也就是幾種樣式的對話框，在 JS 中有三個經常使用的對話框方法：
- onJsAlert 方法是彈出警告框，通常狀況下在 Android 中爲 Toast，在文本里面加入\n就能夠換行；
- onJsConfirm 彈出確認框，會返回布爾值，經過這個值能夠判斷點擊時確認仍是取消，true表示點擊了確認，false表示點擊了取消；
- onJsPrompt 彈出輸入框，點擊確認返回輸入框中的值，點擊取消返回 null。
- 可是這三種對話框都是能夠本地攔截到的，因此能夠從這裏去作一些更改，攔截這些方法，獲得他們的內容，進行解析，好比若是是 JS 的協議，則說明爲內部協議，進行下一步解析而後進行相關的操做便可，prompt 方法調用以下所示：
function clickprompt(){ var result=prompt("js://openActivity?arg1=111&arg2=222"); alert("open activity " + result); } 複製代碼- 須要注意的是 prompt 裏面的內容是經過 message 傳遞過來的，並非第二個參數的 url，返回值是經過 JsPromptResult 對象傳遞。爲何要攔截 onJsPrompt 方法，而不是攔截其餘的兩個方法，這個從某種意義上來講都是可行的，可是若是須要返回值給 web 端的話就不行了，由於 onJsAlert 是不能返回值的，而 onJsConfirm 只可以返回肯定或者取消兩個值，只有 onJsPrompt 方法是能夠返回字符串類型的值，操做最全面方便。
- 以上三種方案的總結和對比
- 以上三種方案都是可行的，在這裏總結一下
- 第一種方式：是如今目前最廣泛的用法，方便簡潔，可是惟一的不足是在 4.2 系統如下存在漏洞問題；
- 第二種方式：經過攔截 url 並解析，若是是已經約定好的協議則進行相應規定好的操做，缺點就是協議的約束須要記錄一個規範的文檔，並且從 Native 層往 Web 層傳遞值比較繁瑣，優勢就是不會存在漏洞，iOS7 之下的版本就是使用的這種方式。
- 第三種方式：和第二種方式的思想實際上是相似的，只是攔截的方法變了，這裏攔截了 JS 中的三種對話框方法，而這三種對話框方法的區別就在於返回值問題，alert 對話框沒有返回值，confirm 的對話框方法只有兩種狀態的返回值，prompt 對話框方法能夠返回任意類型的返回值，缺點就是協議的制定比較麻煩，須要記錄詳細的文檔，可是不會存在第二種方法的漏洞問題。
1.0.4 WebView.loadUrl(url)流程
- WebView.loadUrl(url)加載網頁作了什麼？
- 加載網頁是一個複雜的過程，在這個過程當中，咱們可能須要執行一些操做，包括：
- 加載網頁前，重置WebView狀態以及與業務綁定的變量狀態。WebView狀態包括重定向狀態(mTouchByUser)、前端控制的回退棧(mBackStep)等，業務狀態包括進度條、當前頁的分享內容、分享按鈕的顯示隱藏等。
- 加載網頁前，根據不一樣的域拼接本地客戶端的參數，包括基本的機型信息、版本信息、登陸信息以及埋點使用的Refer信息等，有時候涉及交易、財產等還須要作額外的配置。
- 開始執行頁面加載操做時，會回調WebViewClient.onPageStarted(webview,url,favicon)。在此方法中，能夠重置重定向保護的變量(mRedirectProtected)，固然也能夠在頁面加載前重置，因爲歷史遺留代碼問題，此處還沒有省去優化。
- 加載頁面的過程當中，WebView會回調幾個方法。
- 頁面加載結束後，WebView會回調幾個方法。
- 加載頁面的過程當中回調哪些方法？
- WebChromeClient.onReceivedTitle(webview, title)，用來設置標題。須要注意的是，在部分Android系統版本中可能會回調屢次這個方法，並且有時候回調的title是一個url，客戶端能夠針對這種狀況進行特殊處理，避免在標題欄顯示沒必要要的連接。
- WebChromeClient.onProgressChanged(webview, progress)，根據這個回調，能夠控制進度條的進度（包括顯示與隱藏）。通常狀況下，想要達到100%的進度須要的時間較長（特別是首次加載），用戶長時間等待進度條不消失一定會感到焦慮，影響體驗。其實當progress達到80的時候，加載出來的頁面已經基本可用了。事實上，國內廠商大部分都會提早隱藏進度條，讓用戶覺得網頁加載很快。
- WebViewClient.shouldInterceptRequest(webview, request)，不管是普通的頁面請求(使用GET/POST)，仍是頁面中的異步請求，或者頁面中的資源請求，都會回調這個方法，給開發一次攔截請求的機會。在這個方法中，咱們能夠進行靜態資源的攔截並使用緩存數據代替，也能夠攔截頁面，使用本身的網絡框架來請求數據。包括後面介紹的WebView免流方案，也和此方法有關。
- WebViewClient.shouldOverrideUrlLoading(webview, request)，若是遇到了重定向，或者點擊了頁面中的a標籤實現頁面跳轉，那麼會回調這個方法。能夠說這個是WebView裏面最重要的回調之一，後面WebView與Native頁面交互一節將會詳細介紹這個方法。
- WebViewClient.onReceivedError(webview,handler,error)，加載頁面的過程當中發生了錯誤，會回調這個方法。主要是http錯誤以及ssl錯誤。在這兩個回調中，咱們能夠進行異常上報，監控異常頁面、過時頁面，及時反饋給運營或前端修改。在處理ssl錯誤時，遇到不信任的證書能夠進行特殊處理，例如對域名進行判斷，針對本身公司的域名「放行」，防止進入醜陋的錯誤證書頁面。也能夠與Chrome同樣，彈出ssl證書疑問彈窗，給用戶選擇的餘地。
- 加載頁面結束回調哪些方法
- 會回調WebViewClient.onPageFinished(webview,url)。
- 這時候能夠根據回退棧的狀況判斷是否顯示關閉WebView按鈕。經過mActivityWeb.canGoBackOrForward(-1)判斷是否能夠回退。
1.0.5 js的調用時機分析
- onPageFinished()或者onPageStarted()方法中注入js代碼
- 作過WebView開發，而且須要和js交互，大部分都會認爲js在WebViewClient.onPageFinished()方法中注入最合適，此時dom樹已經構建完成，頁面已經徹底展示出來。但若是作過頁面加載速度的測試，會發現WebViewClient.onPageFinished()方法一般須要等待好久纔會回調（首次加載一般超過3s），這是由於WebView須要加載完一個網頁裏主文檔和全部的資源纔會回調這個方法。
- 能不能在WebViewClient.onPageStarted()中注入呢？答案是不肯定。通過測試，有些機型能夠，有些機型不行。在WebViewClient.onPageStarted()中注入還有一個致命的問題——這個方法可能會回調屢次，會形成js代碼的屢次注入。
- 從7.0開始，WebView加載js方式發生了一些小改變，官方建議把js注入的時機放在頁面開始加載以後。
- WebViewClient.onProgressChanged()方法中注入js代碼
- WebViewClient.onProgressChanged()這個方法在dom樹渲染的過程當中會回調屢次，每次都會告訴咱們當前加載的進度。
- 在這個方法中，能夠給WebView自定義進度條，相似微信加載網頁時的那種進度條
- 若是在此方法中注入js代碼，則須要避免重複注入，須要加強邏輯。能夠定義一個boolean值變量控制注入時機
- 那麼有人會問，加載到多少才須要處理js注入邏輯呢？
- 正是由於這個緣由，頁面的進度加載到80%的時候，實際上dom樹已經渲染得差很少了，代表WebView已經解析了標籤，這時候注入必定是成功的。在WebViewClient.onProgressChanged()實現js注入有幾個須要注意的地方：
- 1 上文提到的屢次注入控制，使用了boolean值變量控制
- 2 從新加載一個URL以前，須要重置boolean值變量，讓從新加載後的頁面再次注入js
- 3 若是作過本地js，css等緩存，則先判斷本地是否存在，若存在則加載本地，不然加載網絡js
- 4 注入的進度閾值能夠自由定製，理論上10%-100%都是合理的，不過建議使用了75%到90%之間能夠。
- WebViewClient.onProgressChanged()這個方法在dom樹渲染的過程當中會回調屢次，每次都會告訴咱們當前加載的進度。
1.0.6 清除緩存數據方式有哪些
- 清除緩存數據的方法有哪些？
//清除網頁訪問留下的緩存 //因爲內核緩存是全局的所以這個方法不只僅針對webview而是針對整個應用程序. Webview.clearCache(true); //清除當前webview訪問的歷史記錄//只會webview訪問歷史記錄裏的全部記錄除了當前訪問記錄 Webview.clearHistory()； //這個api僅僅清除自動完成填充的表單數據，並不會清除WebView存儲到本地的數據 Webview.clearFormData()； 複製代碼
1.0.7 如何使用DeepLink
- 具體能夠看這篇文章：www.jianshu.com/p/127c80f62…
1.0.8 應用被做爲第三方瀏覽器打開
- 微信裏的文章頁面，能夠選擇「在瀏覽器打開」。如今不少應用都內嵌了WebView，那是否可使本身的應用做爲第三方瀏覽器打開此文章呢？
- 在Manifest文件中，給想要接收跳轉的Activity添加配置：
<activity android:name=".X5WebViewActivity" android:configChanges="orientation|screenSize" android:hardwareAccelerated="true" android:launchMode="singleTask" android:screenOrientation="portrait" android:theme="@style/Theme.AppCompat.Light.NoActionBar"> <!--須要添加下面的intent-filter配置--> <intent-filter tools:ignore="AppLinkUrlError"> <action android:name="android.intent.action.VIEW" /> <category android:name="android.intent.category.DEFAULT" /> <category android:name="android.intent.category.BROWSABLE" /> <!--使用http，則只能打開http開頭的網頁--> <data android:scheme="https" /> </intent-filter> </activity> 複製代碼 - 而後在 X5WebViewActivity 中獲取相關傳遞數據。具體能夠看lib中的X5WebViewActivity類代碼。
public class X5WebViewActivity extends AppCompatActivity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_web_view); getIntentData(); initTitle(); initWebView(); webView.loadUrl(mUrl); // 處理 做爲三方瀏覽器打開傳過來的值 getDataFromBrowser(getIntent()); } /** * 使用singleTask啓動模式的Activity在系統中只會存在一個實例。 * 若是這個實例已經存在，intent就會經過onNewIntent傳遞到這個Activity。 * 不然新的Activity實例被建立。 */ @Override protected void onNewIntent(Intent intent) { super.onNewIntent(intent); getDataFromBrowser(intent); } /** * 做爲三方瀏覽器打開傳過來的值 * Scheme: https * host: www.jianshu.com * path: /p/yc * url = scheme + "://" + host + path; */ private void getDataFromBrowser(Intent intent) { Uri data = intent.getData(); if (data != null) { try { String scheme = data.getScheme(); String host = data.getHost(); String path = data.getPath(); String text = "Scheme: " + scheme + "\n" + "host: " + host + "\n" + "path: " + path; Log.e("data", text); String url = scheme + "://" + host + path; webView.loadUrl(url); } catch (Exception e) { e.printStackTrace(); } } } } 複製代碼 - 一些重點說明
- 在微信中「經過瀏覽器」打開本身的應用，而後將本身的應用切到後臺。重複上面的操做，會一直建立應用的實例，這樣確定是很差的，爲了不這種狀況咱們設置啓動模式爲：launchMode="singleTask"。
02.優化彙總目錄介紹
2.0.1 視頻全屏播放按返回頁面被放大（部分手機出現)
- 至於緣由暫時沒有找到，解決方案以下所示
/** * 當縮放改變的時候會調用該方法 * @param view view * @param oldScale 以前的縮放比例 * @param newScale 如今縮放比例 */ @Override public void onScaleChanged(WebView view, float oldScale, float newScale) { super.onScaleChanged(view, oldScale, newScale); //視頻全屏播放按返回頁面被放大的問題 if (newScale - oldScale > 7) { //異常放大，縮回去。 view.setInitialScale((int) (oldScale / newScale * 100)); } } 複製代碼
2.0.2 加載webView中的資源時，加快加載的速度優化，主要是針對圖片
- html代碼下載到WebView後，webkit開始解析網頁各個節點，發現有外部樣式文件或者外部腳本文件時，會異步發起網絡請求下載文件，但若是在這以前也有解析到image節點，那勢必也會發起網絡請求下載相應的圖片。在網絡狀況較差的狀況下，過多的網絡請求就會形成帶寬緊張，影響到css或js文件加載完成的時間，形成頁面空白loading太久。解決的方法就是告訴WebView先不要自動加載圖片，等頁面finish後再發起圖片加載。
//初始化的時候設置，具體代碼在X5WebView類中 if(Build.VERSION.SDK_INT >= KITKAT) { //設置網頁在加載的時候暫時不加載圖片 ws.setLoadsImagesAutomatically(true); } else { ws.setLoadsImagesAutomatically(false); } /** * 當頁面加載完成會調用該方法 * @param view view * @param url url連接 */ @Override public void onPageFinished(WebView view, String url) { super.onPageFinished(view, url); //頁面finish後再發起圖片加載 if(!webView.getSettings().getLoadsImagesAutomatically()) { webView.getSettings().setLoadsImagesAutomatically(true); } } 複製代碼
2.0.3 自定義加載異常error的狀態頁面，好比下面這些方法中可能會出現error
- 當WebView加載頁面出錯時（通常爲404 NOT FOUND），安卓WebView會默認顯示一個出錯界面。當WebView加載出錯時，會在WebViewClient實例中的onReceivedError()，還有onReceivedTitle方法接收到錯誤
/** * 請求網絡出現error * @param view view * @param errorCode 錯誤🐎 * @param description description * @param failingUrl 失敗連接 */ @Override public void onReceivedError(WebView view, int errorCode, String description, String failingUrl) { super.onReceivedError(view, errorCode, description, failingUrl); if (errorCode == 404) { //用javascript隱藏系統定義的404頁面信息 String data = "Page NO FOUND！"; view.loadUrl("javascript:document.body.innerHTML=\"" + data + "\""); } else { if (webListener!=null){ webListener.showErrorView(); } } } // 向主機應用程序報告Web資源加載錯誤。這些錯誤一般代表沒法鏈接到服務器。 // 值得注意的是，不一樣的是過期的版本的回調，新的版本將被稱爲任何資源（iframe，圖像等） // 不只爲主頁。所以，建議在回調過程當中執行最低要求的工做。 // 6.0 以後 @Override public void onReceivedError(WebView view, WebResourceRequest request, WebResourceError error) { super.onReceivedError(view, request, error); if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.M) { X5WebUtils.log("服務器異常"+error.getDescription().toString()); } //ToastUtils.showToast("服務器異常6.0以後"); //當加載錯誤時，就讓它加載本地錯誤網頁文件 //mWebView.loadUrl("file:///android_asset/errorpage/error.html"); if (webListener!=null){ webListener.showErrorView(); } } /** * 這個方法主要是監聽標題變化操做的 * @param view view * @param title 標題 */ @Override public void onReceivedTitle(WebView view, String title) { super.onReceivedTitle(view, title); if (title.contains("404") || title.contains("網頁沒法打開")){ if (webListener!=null){ webListener.showErrorView(); } } else { // 設置title } } 複製代碼
2.0.4 WebView硬件加速致使頁面渲染閃爍
- 4.0以上的系統咱們開啓硬件加速後，WebView渲染頁面更加快速，拖動也更加順滑。但有個反作用就是，當WebView視圖被總體遮住一塊，而後忽然恢復時（好比使用SlideMenu將WebView從側邊滑出來時），這個過渡期會出現白塊同時界面閃爍。解決這個問題的方法是在過渡期前將WebView的硬件加速臨時關閉，過渡期後再開啓
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.HONEYCOMB) { webview.setLayerType(View.LAYER_TYPE_SOFTWARE, null); } 複製代碼
2.0.5 WebView加載證書錯誤
- webView加載一些別人的url時候，有時候會發生證書認證錯誤的狀況，這時候咱們但願可以正常的呈現頁面給用戶，咱們須要忽略證書錯誤，須要調用WebViewClient類的onReceivedSslError方法，調用handler.proceed()來忽略該證書錯誤。
/** * 在加載資源時通知主機應用程序發生SSL錯誤 * 做用：處理https請求 * @param view view * @param handler handler * @param error error */ @Override public void onReceivedSslError(WebView view, SslErrorHandler handler, SslError error) { super.onReceivedSslError(view, handler, error); if (error!=null){ String url = error.getUrl(); X5WebUtils.log("onReceivedSslError----異常url----"+url); } //https忽略證書問題 if (handler!=null){ //表示等待證書響應 handler.proceed(); // handler.cancel(); //表示掛起鏈接，爲默認方式 // handler.handleMessage(null); //可作其餘處理 } } 複製代碼
2.0.6 web音頻播放銷燬後還有聲音
- WebView頁面中播放了音頻,退出Activity後音頻仍然在播放，須要在Activity的onDestory()中調用
@Override protected void onDestroy() { try { //有音頻播放的web頁面的銷燬邏輯 //在關閉了Activity時，若是Webview的音樂或視頻，還在播放。就必須銷燬Webview //可是注意：webview調用destory時,webview仍綁定在Activity上 //這是因爲自定義webview構建時傳入了該Activity的context對象 //所以須要先從父容器中移除webview,而後再銷燬webview: if (webView != null) { ViewGroup parent = (ViewGroup) webView.getParent(); if (parent != null) { parent.removeView(webView); } webView.removeAllViews(); webView.destroy(); webView = null; } } catch (Exception e) { Log.e("X5WebViewActivity", e.getMessage()); } super.onDestroy(); } 複製代碼
2.0.7 DNS採用和客戶端API相同的域名
- 創建鏈接/服務器處理；在頁面請求的數據返回以前，主要有如下過程耗費時間。
DNS connection 服務器處理 複製代碼 - DNS採用和客戶端API相同的域名
- DNS會在系統級別進行緩存，對於WebView的地址，若是使用的域名與native的API相同，則能夠直接使用緩存的DNS而不用再發起請求圖片。
- 舉個簡單例子，客戶端請求域名主要位於api.yc.com，然而內嵌的WebView主要位於 i.yc.com。
- 當咱們初次打開App時：客戶端首次打開都會請求api.yc.com，其DNS將會被系統緩存。然而當打開WebView的時候，因爲請求了不一樣的域名，須要從新獲取i.yc.com的IP。靜態資源同理，最好與客戶端的資源域名保持一致。
2.0.8 如何設置白名單操做
- 客戶端內的WebView都是能夠經過客戶端的某個schema打開的，而要打開頁面的URL不少都並不寫在客戶端內，而是能夠由URL中的參數傳遞過去的。上面4.0.5 使用scheme協議打開連接風險已經說明了scheme使用的危險性，那麼如何避免這個問題了，設置運行訪問的白名單。或者當用戶打開外部連接前給用戶強烈而明顯的提示。具體操做以下所示：
- 在onPageStarted開始加載資源的方法中，獲取加載url的host值，而後和本地保存的合法host作比較，這裏domainList是一個數組
@Override public void onPageStarted(WebView view, String url, Bitmap favicon) { super.onPageStarted(view, url, favicon); String host = Uri.parse(url).getHost(); LoggerUtils.i("host:" + host); if (!BuildConfig.IS_DEBUG) { if (Arrays.binarySearch(domainList, host) < 0) { //不在白名單內，非法網址，這個時候給用戶強烈而明顯的提示 } else { //合法網址 } } } 複製代碼 - 設置白名單操做其實和過濾廣告是一個意思，這裏你能夠放一些合法的網址容許訪問。
2.0.9 後臺沒法釋放js致使發熱耗電
- 在有些手機你若是webView加載的html裏，有一些js一直在執行好比動畫之類的東西，若是此刻webView 掛在了後臺這些資源是不會被釋放用戶也沒法感知。
- 致使一直佔有cpu 耗電特別快，因此若是遇到這種狀況，處理方式以下所示。大概意思就是在後臺的時候，會調用onStop方法，即此時關閉js交互，回到前臺調用onResume再開啓js交互。
//在onStop裏面設置setJavaScriptEnabled(false); //在onResume裏面設置setJavaScriptEnabled(true)。 @Override protected void onResume() { super.onResume(); if (mWebView != null) { mWebView.getSettings().setJavaScriptEnabled(true); } } @Override protected void onStop() { super.onStop(); if (mWebView != null) { mWebView.getSettings().setJavaScriptEnabled(false); } } 複製代碼
2.1.0 能夠提早顯示加載進度條
- 提早顯示進度條不是提高性能 ， 可是對用戶體驗來講也是很重要的一點 ， WebView.loadUrl("url") 不會立馬就回調 onPageStarted 或者 onProgressChanged 由於在這一時間段，WebView 有可能在初始化內核，也有可能在與服務器創建鏈接，這個時間段容易出現白屏，白屏用戶體驗是很糟糕的 ，因此建議
//正確 pb.setVisibility(View.VISIBLE); mWebView.loadUrl("https://github.com/yangchong211/LifeHelper"); //不太好 @Override public void onPageStarted(WebView webView, String s, Bitmap bitmap) { super.onPageStarted(webView, s, bitmap); //設定加載開始的操做 pb.setVisibility(View.VISIBLE); } //下面這個是監聽進度條進度變化的邏輯 mWebView.getX5WebChromeClient().setWebListener(interWebListener); mWebView.getX5WebViewClient().setWebListener(interWebListener); private InterWebListener interWebListener = new InterWebListener() { @Override public void hindProgressBar() { pb.setVisibility(View.GONE); } @Override public void showErrorView() { } @Override public void startProgress(int newProgress) { pb.setProgress(newProgress); } @Override public void showTitle(String title) { } }; 複製代碼
2.1.1 WebView密碼明文存儲漏洞優化
- WebView 默認開啓密碼保存功能 mWebView.setSavePassword(true)，若是該功能未關閉，在用戶輸入密碼時，會彈出提示框，詢問用戶是否保存密碼，若是選擇」是」，密碼會被明文保到 /data/data/com.package.name/databases/webview.db 中，這樣就有被盜取密碼的危險，因此須要經過 WebSettings.setSavePassword(false) 關閉密碼保存提醒功能。
- 具體代碼操做以下所示
/設置是否開啓密碼保存功能，不建議開啓，默認已經作了處理，存在盜取密碼的危險 mX5WebView.setSavePassword(false); 複製代碼
03.問題彙總目錄介紹
3.0.0 WebView進化史介紹
- 進化史以下所示
- 從Android4.4系統開始，Chromium內核取代了Webkit內核。
- 從Android5.0系統開始，WebView移植成了一個獨立的apk，能夠不依賴系統而獨立存在和更新。
- 從Android7.0 系統開始，若是用戶手機裏安裝了 Chrome ， 系統優先選擇 Chrome 爲應用提供 WebView 渲染。
- 從Android8.0系統開始，默認開啓WebView多進程模式，即WebView運行在獨立的沙盒進程中。
3.0.1 提早初始化WebView必要性
- 第一次打開Web面 ，使用WebView加載頁面的時候特別慢，第二次打開就能明顯的感受到速度有提高，爲何？
- 是由於在你第一次加載頁面的時候 WebView 內核並無初始化 ，因此在第一次加載頁面的時候須要耗時去初始化WebView內核 。
- 提早初始化WebView內核 ，例如以下把它放到了Application裏面去初始化 , 在頁面裏能夠直接使用該WebView，這種方法能夠比較有效的減小WebView在App中的首次打開時間。當用戶訪問頁面時，不須要初始化WebView的時間。
- 可是這樣也有很差的地方，額外的內存消耗。頁面間跳轉須要清空上一個頁面的痕跡，更容易內存泄露。
3.0.2 x5加載office資源
- 關於加載word，pdf，xls等文檔文件注意事項：Tbs不支持加載網絡的文件，須要先把文件下載到本地，而後再加載出來
- 還有一點要注意，在onDestroy方法中調用此方法mTbsReaderView.onStop()，不然第二次打開沒法瀏覽。更多能夠看FileReaderView類代碼！
3.0.3 WebView播放視頻問題
- 一、這次的方案用到WebView，並且其中會有視頻嵌套，在默認的WebView中直接播放視頻會有問題， 並且不一樣的SDK版本狀況還不同，網上搜索了下解決方案，在此記錄下. webView.getSettings.setPluginState(PluginState.ON);webView.setWebChromeClient(new WebChromeClient());
- 二、而後在webView的Activity配置裏面加上： android:hardwareAccelerated="true"
- 三、以上能夠正常播放視頻了，可是webview的頁面都finish了竟然還能聽 到視頻播放的聲音， 因而又查了下發現webview的onResume方法能夠繼續播放，onPause能夠暫停播放， 可是這兩個方法都是在Added in API level 11添加的，因此須要用反射來完成。
- 四、中止播放：在頁面的onPause方法中使用：webView.getClass().getMethod("onPause").invoke(webView, (Object[])null);
- 五、繼續播放：在頁面的onResume方法中使用：webView.getClass().getMethod("onResume").invoke(webView,(Object[])null);這樣就能夠控制視頻的暫停和繼續播放了。
3.0.4 沒法獲取webView的正確高度
- 偶發狀況，獲取不到webView的內容高度
- 其中htmlString是一個HTML格式的字符串。
webView.loadData(htmlString, "text/html", "utf-8"); webView.setWebViewClient(new WebViewClient() { public void onPageFinished(WebView view, String url) { super.onPageFinished(view, url); Log.d("yc", view.getContentheight() + ""); } }); 複製代碼- 這是由於onPageFinished回調指的WebView已經完成從網絡讀取的字節數，這一點。在點onPageFinished被激發的頁面可能尚未被解析。
- 第一種解決辦法：提供onPageFinished（）一些延遲
webView.setWebViewClient(new WebViewClient() { @Override public void onPageFinished(WebView view, String url) { super.onPageFinished(view, url); webView.postDelayed(new Runnable() { @Override public void run() { int contentHeight = webView.getContentHeight(); int viewHeight = webView.getHeight(); } }, 500); } }); 複製代碼 - 第二種解決辦法：使用js獲取內容高度，具體能夠看這篇文章：www.jianshu.com/p/ad22b2649…
3.0.5 使用scheme協議打開連接風險
- 常見的用法是在APP獲取到來自網頁的數據後，從新生成一個intent，而後發送給別的組件使用這些數據。好比使用Webview相關的Activity來加載一個來自網頁的url，若是此url來自url scheme中的參數，如：yc://ycbjie:8888/from?load_url=http://www.taobao.com。
- 若是在APP中，沒有檢查獲取到的load_url的值，攻擊者能夠構造釣魚網站，誘導用戶點擊加載，就能夠盜取用戶信息。
- 這個時候，別人非法篡改參數，因而將scheme協議改爲yc://ycbjie:8888/from?load_url=http://www.doubi.com。這個時候點擊進去便可進入釣魚連接地址。
- 使用建議
- APP中任何接收外部輸入數據的地方都是潛在的攻擊點，過濾檢查來自網頁的參數。
- 不要經過網頁傳輸敏感信息，有的網站爲了引導已經登陸的用戶到APP上使用，會使用腳本動態的生成URL Scheme的參數，其中包括了用戶名、密碼或者登陸態token等敏感信息，讓用戶打開APP直接就登陸了。惡意應用也能夠註冊相同的URL Sechme來截取這些敏感信息。Android系統會讓用戶選擇使用哪一個應用打開連接，可是若是用戶不注意，就會使用惡意應用打開，致使敏感信息泄露或者其餘風險。
- 解決辦法
- 在內嵌的WebView中應該限制容許打開的WebView的域名，並設置運行訪問的白名單。或者當用戶打開外部連接前給用戶強烈而明顯的提示。具體操做能夠看5.0.8 如何設置白名單操做方式。
3.0.6 如何處理加載錯誤(Http、SSL、Resource)
- 對於WebView加載一個網頁過程當中所產生的錯誤回調，大體有三種
/** * 只有在主頁面加載出現錯誤時，纔會回調這個方法。這正是展現加載錯誤頁面最合適的方法。 * 然而，若是無論三七二十一直接展現錯誤頁面的話，那頗有可能會誤判，給用戶形成常常加載頁面失敗的錯覺。 * 因爲不一樣的WebView實現可能不同，因此咱們首先須要排除幾種誤判的例子： * 1.加載失敗的url跟WebView裏的url不是同一個url，排除； * 2.errorCode=-1，代表是ERROR_UNKNOWN的錯誤，爲了保證不誤判，排除 * 3failingUrl=null&errorCode=-12，因爲錯誤的url是空而不是ERROR_BAD_URL，排除 * @param webView webView * @param errorCode errorCode * @param description description * @param failingUrl failingUrl */ @Override public void onReceivedError(WebView webView, int errorCode, String description, String failingUrl) { super.onReceivedError(webView, errorCode, description, failingUrl); // -12 == EventHandle.ERROR_BAD_URL, a hide return code inside android.net.http package if ((failingUrl != null && !failingUrl.equals(webView.getUrl()) && !failingUrl.equals(webView.getOriginalUrl())) /* not subresource error*/ || (failingUrl == null && errorCode != -12) /*not bad url*/ || errorCode == -1) { //當 errorCode = -1 且錯誤信息爲 net::ERR_CACHE_MISS return; } if (!TextUtils.isEmpty(failingUrl)) { if (failingUrl.equals(webView.getUrl())) { //作本身的錯誤操做，好比自定義錯誤頁面 } } } /** * 只有在主頁面加載出現錯誤時，纔會回調這個方法。這正是展現加載錯誤頁面最合適的方法。 * 然而，若是無論三七二十一直接展現錯誤頁面的話，那頗有可能會誤判，給用戶形成常常加載頁面失敗的錯覺。 * 因爲不一樣的WebView實現可能不同，因此咱們首先須要排除幾種誤判的例子： * 1.加載失敗的url跟WebView裏的url不是同一個url，排除； * 2.errorCode=-1，代表是ERROR_UNKNOWN的錯誤，爲了保證不誤判，排除 * 3failingUrl=null&errorCode=-12，因爲錯誤的url是空而不是ERROR_BAD_URL，排除 * @param webView webView * @param webResourceRequest webResourceRequest * @param webResourceError webResourceError */ @Override public void onReceivedError(WebView webView, WebResourceRequest webResourceRequest, WebResourceError webResourceError) { super.onReceivedError(webView, webResourceRequest, webResourceError); } /** * 任何HTTP請求產生的錯誤都會回調這個方法，包括主頁面的html文檔請求，iframe、圖片等資源請求。 * 在這個回調中，因爲混雜了不少請求，不適合用來展現加載錯誤的頁面，而適合作監控報警。 * 當某個URL，或者某個資源收到大量報警時，說明頁面或資源可能存在問題，這時候可讓相關運營及時響應修改。 * @param webView webView * @param webResourceRequest webResourceRequest * @param webResourceResponse webResourceResponse */ @Override public void onReceivedHttpError(WebView webView, WebResourceRequest webResourceRequest, WebResourceResponse webResourceResponse) { super.onReceivedHttpError(webView, webResourceRequest, webResourceResponse); } /** * 任何HTTPS請求，遇到SSL錯誤時都會回調這個方法。 * 比較正確的作法是讓用戶選擇是否信任這個網站，這時候能夠彈出信任選擇框供用戶選擇（大部分正規瀏覽器是這麼作的）。 * 有時候，針對本身的網站，可讓一些特定的網站，無論其證書是否存在問題，都讓用戶信任它。 * 坑：有時候部分手機打開頁面報錯，絕招：讓本身網站的全部二級域都是可信任的。 * @param webView webView * @param sslErrorHandler sslErrorHandler * @param sslError sslError */ @Override public void onReceivedSslError(WebView webView, SslErrorHandler sslErrorHandler, SslError sslError) { super.onReceivedSslError(webView, sslErrorHandler, sslError); //判斷網站是不是可信任的，與本身網站host做比較 if (WebViewUtils.isYCHost(webView.getUrl())) { //若是是本身的網站，則繼續使用SSL證書 sslErrorHandler.proceed(); } else { super.onReceivedSslError(webView, sslErrorHandler, sslError); } } 複製代碼
3.0.7 webView防止內存泄漏
3.0.9 視頻/圖片寬度超過屏幕
- 視頻播放寬度或者圖片寬度比webView設置的寬度大，超過屏幕：這個時候能夠設置ws.setLoadWithOverviewMode(false);
- 另一種讓圖片不超出屏幕範圍的方法，能夠用的是css
<script type="text/javascript"> var tables = document.getElementsByTagName("img"); //找到table標籤 for(var i = 0; i<tables.length; i++){ // 逐個改變 tables[i].style.width = "100%"; // 寬度改成100% tables[i].style.height = "auto"; } </script> 複製代碼 - 經過webView的setting屬性設置
// 網頁內容的寬度是否可大於WebView控件的寬度 ws.setLoadWithOverviewMode(false); 複製代碼
3.1.0 如何保證js安全性
- Android和js如何通訊
- 爲了與Web頁面實現動態交互，Android應用程序容許WebView經過WebView.addJavascriptInterface接口向Web頁面注入Java對象，頁面Javascript腳本可直接引用該對象並調用該對象的方法。
- 這類應用程序通常都會有相似以下的代碼：
webView.addJavascriptInterface(javaObj, "jsObj"); 複製代碼 - 此段代碼將javaObj對象暴露給js腳本，能夠經過jsObj對象對其進行引用，調用javaObj的方法。結合Java的反射機制能夠經過js腳本執行任意Java代碼，相關代碼以下：
- 當受影響的應用程序執行到上述腳本的時候，就會執行someCmd指定的命令。
<script>   function execute(cmdArgs) {   return jsobj.getClass().forName("java.lang.Runtime").getMethod("getRuntime",null).invoke(null,null).exec(cmdArgs);   }   execute(someCmd); </script> 複製代碼
- addJavascriptInterface任何命令執行漏洞
- 在webView中使用js與html進行交互是一個不錯的方式，可是，在Android4.2(16，包含4.2)及如下版本中，若是使用addJavascriptInterface，則會存在被注入js接口的漏洞；在4.2以後，因爲Google增長了@JavascriptInterface，該漏洞得以解決。
- @JavascriptInterface註解作了什麼操做
- 以前，任何Public的函數均可以在JS代碼中訪問，而Java對象繼承關係會致使不少Public的函數均可以在JS中訪問，其中一個重要的函數就是getClass()。而後JS能夠經過反射來訪問其餘一些內容。經過引入 @JavascriptInterface註解，則在JS中只能訪問 @JavascriptInterface註解的函數。這樣就能夠加強安全性。
3.1.1 如何代碼開啓硬件加速
- 開啓軟硬件加速這個性能提高仍是很明顯的，可是會耗費更大的內存 。直接調用代碼api便可完成，webView.setOpenLayerType(true);
3.1.2 WebView設置Cookie
- h5頁面爲什麼要設置cookie，主要是避免網頁重複登陸，做用是記錄用戶登陸信息，下次進去不須要重複登陸。
- 代碼裏怎麼設置Cookie，以下所示
/** * 同步cookie * * @param url 地址 * @param cookieList 須要添加的Cookie值,以鍵值對的方式:key=value */ private void syncCookie (Context context , String url, ArrayList<String> cookieList) { //初始化 CookieSyncManager.createInstance(context); //獲取對象 CookieManager cookieManager = CookieManager.getInstance(); cookieManager.setAcceptCookie(true); //移除 cookieManager.removeSessionCookie(); //添加 if (cookieList != null && cookieList.size() > 0) { for (String cookie : cookieList) { cookieManager.setCookie(url, cookie); } } String cookies = cookieManager.getCookie(url); X5LogUtils.d("cookies-------"+cookies); if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) { cookieManager.flush(); } else { CookieSyncManager.getInstance().sync(); } } 複製代碼 - 在android裏面在調用webView.loadUrl(url)以前一句調用此方法就能夠給WebView設置Cookie
- 注:這裏必定要注意一點，在調用設置Cookie以後不能再設置，不然設置Cookie無效。該處須要校驗，爲什麼？？？
webView.getSettings().setBuiltInZoomControls(true); webView.getSettings().setJavaScriptEnabled(true); 複製代碼 - 還有跨域問題： 域A: test1.yc.com 域B: test2.yc.com
- 那麼在域A生產一個可使域A和域B都能訪問的Cookie就須要將Cookie的domain設置爲.yc.com；
- 若是要在域A生產一個令域A不能訪問而域能訪問的Cookie就要將Cookie設置爲test2.yc.com。
- Cookie的過時機制
- 能夠設置Cookie的生效時間字段名爲： expires 或 max-age。
- expires：過時的時間點
- max-age：生效的持續時間，單位爲秒。
- 若將Cookie的 max-age 設置爲負數，或者 expires 字段設置爲過時時間點，數據庫更新後這條Cookie將從數據庫中被刪除。若是將Cookie的 max-age 和 expires 字段設置爲正常的過時日期，則到期後再數據庫更新時會刪除該條數據。
- 能夠設置Cookie的生效時間字段名爲： expires 或 max-age。
- 下面列出幾個有用的接口：
- 獲取某個url下的全部Cookie：CookieManager.getInstance().getCookie(url)
- 判斷WebView是否接受Cookie：CookieManager.getInstance().acceptCookie()
- 清除Session Cookie：CookieManager.getInstance().removeSessionCookies(ValueCallback callback)
- 清除全部Cookie：CookieManager.getInstance().removeAllCookies(ValueCallback callback)
- Cookie持久化：CookieManager.getInstance().flush()
- 針對某個主機設置Cookie：CookieManager.getInstance().setCookie(String url, String value)
3.1.4 webView加載網頁不顯示圖片
- webView從Lollipop(5.0)開始webView默認不容許混合模式, https當中不能加載http資源, 而開發的時候可能使用的是https的連接, 可是連接中的圖片多是http的, 因此須要設置開啓。
if (Build.VERSION.SDK_INT > Build.VERSION_CODES.LOLLIPOP) { mWebView.getSettings().setMixedContentMode(WebSettings.MIXED_CONTENT_ALWAYS_ALLOW); } mWebView.getSettings().setBlockNetworkImage(false); 複製代碼
3.1.5 繞過證書校驗漏洞
- webviewClient中有onReceivedError方法，當出現證書校驗錯誤時，咱們能夠在該方法中使用handler.proceed()來忽略證書校驗繼續加載網頁，或者使用默認的handler.cancel()來終端加載。
- 由於咱們使用了handler.proceed()，由此產生了該「繞過證書校驗漏洞」。若是肯定全部頁面都能知足證書校驗，則沒必要要使用handler.proceed()
@SuppressLint("NewApi") @Override public void onReceivedSslError(WebView view, SslErrorHandler handler, SslError error) { //handler.proceed();// 接受證書 super.onReceivedSslError(view, handler, error); } 複製代碼
3.1.6 allowFileAccess漏洞
- 若是webView.getSettings().setAllowFileAccess(boolean)設置爲true，則會面臨該問題；該漏洞是經過WebView對Javascript的延時執行和html文件替換產生的。
- 解決方案是禁止WebView頁面打開本地文件，即：webView.getSettings().setAllowFileAccess(false);
- 或者更直接的禁止使用JavaScript：webView.getSettings().setJavaScriptEnabled(false);
3.1.7 WebView嵌套ScrollView問題
- 問題描述
- 當 WebView 嵌套在 ScrollView 裏面的時候，若是 WebView 先加載了一個高度很高的網頁，而後加載了一個高度很低的網頁，就會形成 WebView 的高度沒法自適應，底部出現大量空白的狀況出現。
- 解決辦法
- 能夠參考這篇博客：blog.csdn.net/self_study/…
3.1.8 WebView中圖片點擊放大
- 首先載入js
//將js對象與java對象進行映射 webView.addJavascriptInterface(new ImageJavascriptInterface(context), "imagelistener"); 複製代碼 - html加載完成以後，添加監聽圖片的點擊js函數，這個能夠在onPageFinished方法中操做
@Override public void onPageFinished(WebView view, String url) { X5LogUtils.i("-------onPageFinished-------"+url); //html加載完成以後，添加監聽圖片的點擊js函數 //addImageClickListener(); addImageArrayClickListener(webView); } 複製代碼 - 具體看addImageArrayClickListener的實現方法。
/** * android與js交互： * 首先咱們拿到html中加載圖片的標籤img. * 而後取出其對應的src屬性 * 循環遍歷設置圖片的點擊事件 * 將src做爲參數傳給java代碼 * 這個循環將所圖片放入數組，當js調用本地方法時傳入。 * 固然若是採用方式一獲取圖片的話，本地方法能夠不須要傳入這個數組 * 經過js代碼找到標籤爲img的代碼塊，設置點擊的監聽方法與本地的openImage方法進行鏈接 * @param webView webview */ private void addImageArrayClickListener(WebView webView) { webView.loadUrl("javascript:(function(){" + "var objs = document.getElementsByTagName(\"img\"); " + "var array=new Array(); " + "for(var j=0;j<objs.length;j++){" + " array[j]=objs[j].src; " + "}"+ "for(var i=0;i<objs.length;i++) " + "{" + " objs[i].onclick=function() " + " { " + " window.imagelistener.openImage(this.src,array); " + " } " + "}" + "})()"); } 複製代碼 - 最後看看js的通訊接口作了什麼
public class ImageJavascriptInterface { private Context context; private String[] imageUrls; public ImageJavascriptInterface(Context context,String[] imageUrls) { this.context = context; this.imageUrls = imageUrls; } public ImageJavascriptInterface(Context context) { this.context = context; } /** * 接口返回的方式 */ @android.webkit.JavascriptInterface public void openImage(String img , String[] imageUrls) { Intent intent = new Intent(); intent.putExtra("imageUrls", imageUrls); intent.putExtra("curImageUrl", img); // intent.setClass(context, PhotoBrowserActivity.class); context.startActivity(intent); for (int i = 0; i < imageUrls.length; i++) { Log.e("圖片地址"+i,imageUrls[i].toString()); } } } 複製代碼
3.1.9 頁面滑動期間不渲染/執行
- 在有些需求中會有一些吸頂的元素，例如導航條，購買按鈕等；當頁面滾動超出元素高度後，元素吸附在屏幕頂部。在WebView中成了難題：在頁面滾動期間，Scroll Event不觸發。不只如此，WebView在滾動期間還有各類限定：
- setTimeout和setInterval不觸發。
- GIF動畫不播放。
- 不少回調會延遲到頁面中止滾動以後。
- background-position: fixed不支持。
- 這些限制讓WebView在滾動期間很難有較好的體驗。這些限制大部分是不可突破的，但至少對於吸頂功能仍是能夠作一些支持，解決方法：
- 在Android上，監聽touchMove事件能夠在滑動期間作元素的position切換（慣性運動期間就無效了）。
- 參考美團技術文章
3.2.0 被運營商劫持和注入問題
- 因爲WebView加載的頁面代碼是從服務器動態獲取的，這些代碼將會很容易被中間環節所竊取或者修改，其中最主要的問題出自地方運營商和一些WiFi。監測到的問題包括：
- 無視通訊規則強制緩存頁面。
- header被篡改。
- 頁面被注入廣告。
- 頁面被重定向。
- 頁面被重定向並從新iframe到新頁面，框架嵌入廣告。
- HTTPS請求被攔截。
- DNS劫持。
- 針對頁面注入的行爲，有一些解決方案：
- 1.使用CSP（Content Security Policy）
- 2.HTTPS。
- HTTPS能夠防止頁面被劫持或者注入，然而其反作用也是明顯的，網絡傳輸的性能和成功率都會降低，並且HTTPS的頁面會要求頁面內全部引用的資源也是HTTPS的，對於大型網站其遷移成本並不算低。HTTPS的一個問題在於：一旦底層想要篡改或者劫持，會致使整個連接失效，頁面沒法展現。這會帶來一個問題：原本頁面只是會被注入廣告，並且廣告會被CSP攔截，而採用了HTTPS後，整個網頁因爲受到劫持徹底沒法展現。
- 對於安全要求不高的靜態頁面，就須要權衡HTTPS帶來的利與弊了。
- 3.App使用Socket代理請求
- 若是HTTP請求容易被攔截，那麼讓App將其轉換爲一個Socket請求，並代理WebView的訪問也是一個辦法。
- 一般不法運營商或者WiFi都只能攔截HTTP（S）請求，對於自定義的包內容則沒法攔截，所以能夠基本解決注入和劫持的問題。
- Socket代理請求也存在問題：
- 首先，使用客戶端代理的頁面HTML請求將喪失邊下載邊解析的能力；根據前面所述，瀏覽器在HTML收到部份內容後就馬上開始解析，並加載解析出來的外鏈、圖片等，執行內聯的腳本……而目前WebView對外並無暴露這種流式的HTML接口，只能由客戶端徹底下載好HTML後，注入到WebView中。所以其性能將會受到影響。
- 其次，其技術問題也是較多的，例如對跳轉的處理，對緩存的處理，對CDN的處理等等……稍不留神就會埋下若干大坑。
- 此外還有一些其餘的辦法，例如頁面的MD5檢測，頁面靜態頁打包下載等等方式，具體如何選擇還要根據具體的場景抉擇。
3.2.1 解決資源加載緩慢問題
- 在資源預加載方面，其實也有不少種方式，下面主要列舉了一些：
- 第一種方式是使用 WebView 自身的緩存機制：若是咱們在 APP 裏面訪問一個頁面，短期內再次訪問這個頁面的時候，就會感受到第二次打開的時候順暢不少，加載速度比第一次的時間要短，這個就是由於 WebView 自身內部會作一些緩存，只要打開過的資源，他都會試着緩存到本地，第二次須要訪問的時候他直接從本地讀取，可是這個讀取實際上是不太穩定的東西，關掉以後，或者說這種緩存失效以後，系統會自動把它清除，咱們沒辦法進行控制。基於這個 WebView 自身的緩存，有一種資源預加載的方案就是，咱們在應用啓動的時候能夠開一個像素的 WebView ，事先去訪問一下咱們經常使用的資源，後續打開頁面的時候若是再用到這些資源他就能夠從本地獲取到，頁面加載的時間會短一些。
- 第二種方案是，本身去構建和管理緩存：把這些須要預加載的資源放在 APP 裏面，多是預先放進去的，也多是後續下載的，問題在於前端這些頁面怎麼去緩存，兩個方案，第一種是前端能夠在 H5 打包的時候把裏面的資源 URL 進行替換，這樣能夠直接訪問本地的地址；第二種是客戶端能夠攔截這些網頁發出的全部請求作替換。
- 具體能夠看美團的技術文章：美團大衆點評 Hybrid 化建設
3.2.2 判斷是否已經滾動到頁面底端
- getScrollY()方法返回的是當前可見區域的頂端距整個頁面頂端的距離,也就是當前內容滾動的距離.
- getHeight()或者getBottom()方法都返回當前WebView 這個容器的高度
- getContentHeight 返回的是整個html的高度,但並不等同於當前整個頁面的高度,由於WebView有縮放功能，因此當前整個頁面的高度實際上應該是原始html 的高度再乘上縮放比例. 所以,更正後的結果,準確的判斷方法應該是：
if(WebView.getContentHeight*WebView.getScale() == (webview.getHeight()+WebView.getScrollY())){ //已經處於底端 } 複製代碼
3.2.3 使用loadData加載html亂碼
- 能夠經過使用 WebView.loadData(String data, String mimeType, String encoding)) 方法來加載一整個 HTML 頁面的一小段內容，第一個就是咱們須要 WebView 展現的內容，第二個是咱們告訴 WebView 咱們展現內容的類型，通常，第三個是字節碼，可是使用的時候，這裏會有一些坑
- 明明已經指定了編碼格式爲 UTF-8，加載卻還會出現亂碼……
String html = new String("<h3>我是loadData() 的標題</h3><p>  我是他的內容</p>"); webView.loadData(html, "text/html", "UTF-8"); 複製代碼 - 使用loadData()或 loadDataWithBaseURL()加載一段HTML代碼片斷
- data:是要加載的數據類型，但在數據裏面不能出現英文字符：'#', '%', '' , '?' 這四個字符，若是有的話能夠用 %23, %25, %27, %3f，這些字符來替換，在平時測試時，你的數據時，你的數據裏含有這些字符，但不會出問題，當出問題時，你能夠替換下。
- %，會報找不到頁面錯誤，頁面全是亂碼。亂碼樣式見符件。
- #，會讓你的goBack失效，但canGoBAck是可使用的。因而就會產生返回按鈕生效，但不能返回的狀況。
- \ 和? 我在轉換時，會報錯，由於它會把\看成轉義符來使用，若是用兩級轉義，也不生效，我是對它無語了。
- 咱們在使用loadData時，就意味着須要把全部的非法字符所有轉換掉，這樣就會給運行速度帶來很大的影響，由於在使用時，在頁面stytle中會使用不少%號。頁面的數據越多，運行的速度就會越慢。
- data中，有人會遇到中文亂碼問題，解決辦法：參數傳"utf-8"，頁面的編碼格式也必須是utf-8，這樣編碼統一就不會亂了。別的編碼我也沒有試過。
- data:是要加載的數據類型，但在數據裏面不能出現英文字符：'#', '%', '' , '?' 這四個字符，若是有的話能夠用 %23, %25, %27, %3f，這些字符來替換，在平時測試時，你的數據時，你的數據裏含有這些字符，但不會出問題，當出問題時，你能夠替換下。
- 解決辦法
String html = new String("<h3>我是loadData() 的標題</h3><p>  我是他的內容</p>"); webView.loadData(html, "text/html;charset=UTF-8", "null"); 複製代碼
3.2.4 WebView下載進度沒法監聽
3.2.5 webView出現302/303重定向
- 專業敘述
- 302重定向又稱之爲302表明暫時性轉移
- 網絡解釋
- 重定向是網頁製做中的一個知識，幾個例子跟你說明，假設你如今所處的位置是一個論壇的登陸頁面，你填寫了賬號，密碼，點擊登錄，若是你的賬號密碼正確，就自動跳轉到論壇的首頁，不正確就返回登陸頁；這裏的自動跳轉，就是重定向的意思。或者能夠說，重定向就是，在網頁上設置一個約束條件，條件知足，就自動轉入到其它網頁、網址 。好比，你輸入一個網站連接，通常能夠直接進入網站，若是出現錯誤，則又跳轉到另一個網頁。
- 舉個例子
- 敘述下這種問題的狀況，就是WebView首先加載A連接，而後在WebView上點擊一個B連接進行加載，B連接會自動跳轉到C連接，這個時候調用WebView的goback方法，會返回到加載B連接，可是B連接又會跳轉到C連接，從而致使無法返回到A連接界面（固然也有朋友說快速的按兩次返回鍵－也就是連續觸發了兩次goback能夠返回到A連接，但並非全部用戶都懂這個，並且操做上也很噁心。），這就是重定向問題。
- 實現WebView的滑動監聽和優雅處理回退棧問題
- WebView可否知道某個url是否是301/302呢？固然知道，WebView可以拿到url的請求信息和響應信息，根據header裏的code很輕鬆就能夠實現，事實正是如此，交給WebView來處理重定向(return false)，這時候按返回鍵，是能夠正常地回到重定向以前的那個頁面的。（PS：從上面的章節可知，WebView在5.0之後是一個獨立的apk，能夠單獨升級，新版本的WebView實現確定處理了重定向問題）
- 可是，業務對url攔截有需求，確定不能把全部的狀況都交給系統WebView處理。爲了解決url攔截問題，本文引入了另外一種思想——經過用戶的touch事件來判斷重定向。具體能夠看項目lib中的ScrollWebView！
04.關於參考
05.關於x5開源庫YCWebView
5.0.1 前沿說明
- 基於騰訊x5封源庫，提升webView開發效率，大概要節約你百分之六十的時間成本。該案例支持處理js的交互邏輯且無耦合、同時暴露進度條加載進度、能夠監聽異常error狀態、支持視頻播放而且能夠全頻、支持加載word，xls，ppt，pdf，txt等文件文檔、發短信、打電話、發郵件、打開文件操做上傳圖片、喚起原生App、x5庫爲最新版本，功能強大。
5.0.2 該庫功能和優點
- 提升webView開發效率，大概要節約你百分之六十的時間成本，一鍵初始化操做；
- 支持處理js的交互邏輯，方便快捷，而且無耦合，操做十分簡單；
- 暴露進度條加載進度，結束，以及異常狀態(分多種狀態：無網絡，404，onReceivedError，sslError異常等)listener給開發者；
- 支持視頻播放，能夠切換成全頻播放視頻，可旋轉屏幕，暴露視頻操做監聽listener給開發者；
- 集成了騰訊x5的WebView，最新版本，功能強大；
- 支持打開文件的操做，好比打開相冊，而後選中圖片上傳，兼容版本(5.0)；
- 支持加載word，xls，ppt，pdf，txt等文件文檔，使用方法十分簡單；
- 支持設置仿微信加載H5頁面進度條，徹底無耦合，操做簡單，極大提升用戶體驗；
5.0.3 項目地址
相關文章
- 1. x5開源庫後續知識點
- 2. 知識點 斷點續傳
- 3. 轉：開源知識庫
- 4. 後臺開發 知識點收集
- 5. 開源考試知識點整理
- 6. sql server 數據庫開發 知識點
- 7. [知識點]後綴數組
- 8. 後端面試知識點
- 9. 後續公衆號知識點整理內容公佈
- 10. tomcat閱讀源碼中涉及的知識點---持續更新
- 更多相關文章...
- • 與傳輸層有關的基本知識 - TCP/IP教程
- • Docker 資源彙總 - Docker教程
- • PHP開發工具
- • Java Agent入門實戰（二）-Instrumentation源碼概述
相關標籤/搜索
每日一句
-
每一个你不满意的现在，都有一个你没有努力的曾经。
歡迎關注本站公眾號,獲取更多信息
相關文章
- 1. x5開源庫後續知識點
- 2. 知識點 斷點續傳
- 3. 轉：開源知識庫
- 4. 後臺開發 知識點收集
- 5. 開源考試知識點整理
- 6. sql server 數據庫開發 知識點
- 7. [知識點]後綴數組
- 8. 後端面試知識點
- 9. 後續公衆號知識點整理內容公佈
- 10. tomcat閱讀源碼中涉及的知識點---持續更新