Android webview加載H5相關知識與理解

十一長假回來，開始搗鼓遺留一些問題，由於webview外連接加載緩慢的問題，決定放到本地加載，本來以爲很簡單的需求但是開始寫的時候還是遇到各種問題，連續兩天一直不停採坑，這裏記錄下，避免以後遇到相似問題。

1、Android 加載本地Html ,導致圖片資源加載錯誤

參考：https://www.jianshu.com/p/018cf169386a 

這裏的src並沒有使用絕對url，而是使用了相對路徑。省略了schema(協議)。而html會爲這些資源的url補充上缺失的部分。這裏甚至可以把host省略，而webview會自動補充schema和host。這個自動補全功能對於前端開發來說是一件好事，這樣在遷移代碼的時候，不需要做絕對路徑的更改。但是在我們的遠端加載切換到本地加載的時候，就會出問題

方法1：既然說html的資源相對鏈接是不能使用的，那麼我們前端開發只要將所有的相對url改成絕對url就可以了

方法2：

 String data = HfFileUtil.readAssetsByName(this, "index.html", "UTF-8");
    
 webView.loadDataWithBaseURL("http://localhost", data, "text/html", "UTF-8", null);

 其中第一個入參baseUrl比較關鍵，根據註釋的說法，使用baseUrl作爲基礎URL。這個基礎URL是可以使得加載js和其他相關URL使用相同的策略，同時意味着可以使用以下的schema：'http', 'https', 'ftp', 'ftps', 'about' or 'javascript' 。那麼正好滿足了現在的需求。同時，如果需要在URL裏面加入請求參數，也能在這個參數內不齊。
第二個入參data就是我們的html內容，直接通過讀取文件的方式生成String字符串即可。
第三個參數mimeType實際上和http請求的Content-Type具有相同作用，通常填寫text/html即可。
第四個參數encoding顧名思義，就是填寫整個html的編碼格式
第五個參數historyUrl用於給前端加入history參數。

2、Android js 交互問題

這個已經被博客寫爛了，不過還是記錄下，方面下次使用直接CV

// 設置編碼
mWebView.getSettings().setDefaultTextEncodingName("utf-8");
// 支持js
mWebView.getSettings().setJavaScriptEnabled(true);
mWebView.setWebChromeClient(new WebChromeClient());
mWebView.getSettings().setJavaScriptCanOpenWindowsAutomatically(true);
mWebView.setWebViewClient(new WebViewClientDemo());
// 載入 js
mWebView.loadData("", "text/html", null);
mWebView.getSettings().setDomStorageEnabled(true);

mWebView.loadUrl("file:///android_asset/playback/index.html");

class WebViewClientDemo extends WebViewClient {

    @Override
    public boolean shouldOverrideUrlLoading(WebView view, String url) {
        System.out.println("url:" + url);
        // 當打開新鏈接時，使用當前的 WebView，不會使用系統其他瀏覽器
        view.loadUrl(url);
        return true;
    }

    @Override
    public void onPageFinished(WebView view, String url) {
        super.onPageFinished(view, url);
        // 在這裏執行你想調用的js函數
        //設置本地調用對象及其接口
        mWebView.addJavascriptInterface(new JsObject(), "android");
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
            String jsonStr = gson.toJson(bean);
            mWebView.evaluateJavascript("javascript:setParams(" + jsonStr + ")", new ValueCallback<String>() {
                @Override
                public void onReceiveValue(String value) {
                    Log.e("-----------執行訪問", value);
                }
            });
        }


    }
}

class JsObject {

    @JavascriptInterface
    public void funAndroid() {
        Toast.makeText(mContext, "調用android本地方法funAndroid!", Toast.LENGTH_LONG).show();
    }

}

 3、遇到js中需要訪問網絡，請注意了，我就是卡到這裏一天。

在Andorid7.0之後，對http請求做了限制。如果js中請求連接不是https的，無效。無效。無效。重要的事情說三次。

方法1： 不用說，讓前端改唄，但是他們的限制不我們多，如果不好改的話，就需要我們做一些設置了。

方法2：在清單文件中設置Application 中添加

android:networkSecurityConfig="@xml/network_security_config"

<?xml version="1.0" encoding="utf-8"?>
<network-security-config>
    <domain-config cleartextTrafficPermitted="true">
        <domain includeSubdomains="true">js中請求的服務器地址</domain>
    </domain-config>
</network-security-config>

這樣配置之後，發現項目中訪問一些外網的時候遇到問題，

所以需要改成這個樣子

<network-security-config>
    <base-config cleartextTrafficPermitted="true">
        <trust-anchors>
            <certificates src="system" />
            <certificates src="user" />
        </trust-anchors>
    </base-config>
</network-security-config>

 

 

 

OK ，WebView 事情的告一段落，現在開始踩 錄屏的坑，文章末尾吐吐槽

Android錄屏 錄製內置音，需要Android 系統權限，這個權限是不給三方APP開放的

領導讓我想辦法：我有啥辦法可想，要不，我去更改系統層源碼，可是這種需要手機Root，你指望所有用戶手機讓我Root?

然後又說讓我給輸出的map4加載音軌，錄製出來的視頻自己合成一遍。我心裏有句話 不值當講不當講 ——不怕領導需求刁鑽，就怕領導懂點技術，就讓你實現自己的想法。我們是一款跑步軟件，目前還因爲跑步途中耗電被系統各種殺死，凍結。現在又爲了這個需求讓我開線程後臺合成視頻。我有啥招~我也很絕望。