How to transform based on the status quo of use:

1 log and online monitoring:

Note: Chrome Devtools affects/takes over the WebView cache itself

Online monitoring indicators:

  • First screen time: callback from the outer activity oncreate to the WebView onFinish
  • Webview page switching time: onStart to onFinish
  • DNS resolution exception, network connection failure,404,50x report and statistics
  • Cache directory size and hit ratio

2 with common calls to android native functionality

  • Take photo/Select image -> Crop -> Compress -> Upload (combined with specific project), return to the local file path or uploaded image URL
  • Modular custom camera/face detection function in the app
  • Location function module, including getting GPS, Geodecode, and even convert to their own backend cityId, etc
  • Get deviceId, uid, userdetail, token, national, basic business functions such as language
  • Open and close the entire activity
  • Jump to other pages in the app (universal jump capability).
  • Skip to other Apps
  • The login
  • share
  • Make phone calls, and call other system functions, etc
  • Log Reporting
  • Control the Toolbar/TitleBar and status bar, full screen, etc

To be dealt with

  • The progress bar
  • Error pages: receive 404,50x, and load local HTML when the network connection fails to optimize the experience
  • https
  • Cookies are synchronous
  • Notification of activity after native is adjusted: it needs to be moved to a separate class for unified management
  • Webview memory leak problem

Load speed optimization

  • The offline package
  • The underlying gray + smoothly switches to VasSonic
  • Cache path customization and size customization
  • Mandatory cache

security

  • Debugable: Set according to the app debugable
  • Js injection attack defense: Remove three interfaces

For Android, there are two methods to call JS code, which are used in combination:

  • 1. LoadUrl () via WebView
  • EvaluateJavascript () via WebView
    public static void runJsFunc(WebView webView,String funcName,@Nullable ValueCallback<String> callback, Object... params){
        if(TextUtils.isEmpty(funcName)){
            return;
        }

        if(webView == null){
            return;
        }
        StringBuilder builder = new StringBuilder(funcName);
        builder.append("(");
        if(params ! = null && params.length >0){ int len = params.length;for (int i = 0; i<len; i++){
                Object param = params[i];
                String str = "";
                if(param ! = null){if(param instanceof String){
                        str = "\" "+param.toString()+"\" ";
                    }else {
                        str = param.toString();
                    }
                }
                builder.append(str);
                if(i ! = len-1){ builder.append(",");
                }
            }
        }
        builder.append(")");
        String jsFunc = builder.toString();
        XLogUtil.d("jsFunc:"+jsFunc);

        webView.post(() -> {
            if(build.version.sdk_int >= build.version_codes.kitkat){// VERSION 4.4 or later, Call with return value js method webView. EvaluateJavascript (jsFunc, new ValueCallback<String>() { @Override public void onReceiveValue(String value) { XLogUtil.d("jsFunc :"+jsFunc +",onReceiveValue:"+value);
                        if(callback ! = null){ callback.onReceiveValue(value); }}}); }else {
                webView.loadUrl("javascript:"+ jsFunc); }}); }Copy the code

There are three ways to call Android code: generally use the first one

  • 1. Map objects through addJavascriptInterface () of WebView
  • 2. Intercept urls via the WebViewClient shouldOverrideUrlLoading () method callback
  • 3. Intercept JS dialogs alert(), Confirm(), prompt () messages by calling back onJsAlert(), onJsConfirm(), onJsPrompt () methods of WebChromeClient

Note: Security when javascript calls Android (addJavascriptInterface):

    public static void keepsafe(WebView webView,boolean debugable){
        if (Build.VERSION.SDK_INT > 10 &&Build.VERSION.SDK_INT < 17) {
            webView.removeJavascriptInterface("searchBoxJavaBridge_");
        }
        if(Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) { WebView.setWebContentsDebuggingEnabled(debugable); }}Copy the code

The webview cache: / / todo

My.oschina.net/yale8848/bl…

Reference:

My.oschina.net/ZhenyuanLiu…

Android: the most comprehensive Webview detailed Webview performance, experience analysis and optimization – Meituan