2

I'm trying to implement an monitoring system that could check if a webpage in WebView(in Android or iOS app) is white screen on user client side, so we can collect the webpage error log and report to our develop team for improving our in-app-webpages' stability.

Jasin Yip
  • 308
  • 1
  • 12
  • 1
    You should take snapshots of the web view that is displaying the content of the web page. However, this sounds like [an XY problem](https://meta.stackexchange.com/q/66377/364493) and it's very likely that you need to handle server responses instead of detecting white screens. – Tamás Sengel Dec 19 '17 at 11:29
  • Thanks @the4kman. But I think the is not an XY problem because even we could make sure the server side could sent a stable response, it doesn't means we can make sure it would render in WebView correctly. One of the big situation is that the network might not been stable, or some Man-in-the-middle attack would happened(especially in China, ISPs would inject some ADs into pages with no https). That's why we need this white-screen monitoring system~ – Jasin Yip Dec 19 '17 at 16:27
  • Yes, take snapshots is a good start. But how do we know if a snapshot is white-screen? – Jasin Yip Dec 19 '17 at 16:31

1 Answers1

0

If you want to get the background color of your loaded html page in the WebView you have to do next:

  1. declare javascript function

    private static final String SHOW_COLOR_SCRIPT = "var color =
    window.getComputedStyle( document.body, null).
    getPropertyValue('background-color');Android.showToast(color);";
    
  2. Create javascript interface

    public class WebAppInterface {
    Context mContext;
    
    /** Instantiate the interface and set the context */
    WebAppInterface(Context c) {
        mContext = c;
    }
    
    /** Show a toast from the web page */
    @JavascriptInterface
    public void showToast(String toast) {
        Toast.makeText(mContext, toast, Toast.LENGTH_SHORT).show();
    }
    }
    
  3. Enable javascript in you webview and set javascript interface

    mWebView.getSettings().setJavaScriptEnabled(true);
    mWebView.addJavascriptInterface(new WebAppInterface(this), "Android");
    
  4. Run declared SHOW_COLOR_SCRIPT to display Toast with html body background color using method

    private void runScript(String script) {
    if (android.os.Build.VERSION.SDK_INT >= android.os.Build.VERSION_CODES.KITKAT) {
        mWebView.evaluateJavascript(script, null);
    } else {
        mWebView.loadUrl("javascript:" + script);
    }
    }
    

But for handling WebView errors it is a bad decision. Try to look here Detecting Webview Error and Show Message

HooliGun
  • 46
  • 3