Solve the problem of blank interface when WebView loads H5 through URL

1. Permission problem: Network permissions need to be set in the configuration file

< uses-permission android:name="android.permission.INTERNET" / >

2. Basic configuration issues

WebSettings webSettings = webView. getSettings (); //Supports scaling and defaults to true.

. setUseWideViewPort (true); //Zoom to screen size webSettings

. setLoadWithOverviewMode (true); //Set default encoding

webSettings. setDefaultTextEncodingName ("utf-8"); ////Set up auto-load pictures

webSettings .setLoadsImagesAutomatically(true);

. settings. setJavaScriptEnabled (true); //Settings to run JS scripts
. settings. setSupportZoom (false); //Used to set webview amplification
.settings.setBuiltInZoomControls(false);

3. Uncaught TypeError: Cannot call method 'getItem' of null anomaly occurs

There is an exception in this line. This is the characteristic of html5. It is a local storage, and the storage capacity is larger than that of cookie. However, this must be started with code in webview of android

Solution: Start the local storage function of html5 of webview.

webview.getSettings().setDomStorageEnabled(true);

webview.getSettings().setAppCacheMaxSize(1024*1024*8);

String appCachePath = getApplicationContext().getCacheDir().getAbsolutePath();

webview.getSettings().setAppCachePath(appCachePath);

webview.getSettings().setAllowFileAccess(true);

webview.getSettings().setAppCacheEnabled(true);

4. When the getDeviceID method is called, the js is not loaded completely, resulting in a blank space

Solution:

webview.setWebViewClient(new WebViewClient() {
@Override
public boolean shouldOverrideUrlLoading(WebView view, String url) {
view.loadUrl(url);
return true;
}

@Override
public void onPageFinished(WebView view, String url) {
super.onPageFinished(view, url);
// Execute what you want to call here js Function 
if(!flag_get_deviceid){
load();
}
}

@Override
public void onReceivedError(WebView view, int errorCode, String description, String failingUrl) {
super.onReceivedError(view, errorCode, description, failingUrl);
}

});

private boolean flag_get_deviceid=false;
public void load(){
String key="";
String androidID="";
try{
androidID = Secure.getString(getContentResolver(),Secure.ANDROID_ID);
Log.d(TAG, "androidID:"+androidID);}catch(Exception e){
Log.e(TAG, "");
}finally{
String script=String.format("javascript:getDeviceID('"+androidID+"')");
webActDetail.evaluateJavascript(script, new ValueCallback<String>() {

@Override
public void onReceiveValue(String value) {
Log.d(TAG, "onReceiveValue value=" + value);

if(value!=null){
flag_get_deviceid=true;
}
}});
}
}

5. android mobile phone version problem. Now H5 interface is diversified, which leads to many H5 interfaces that cannot be displayed or have disordered styles on lower versions of models

Solution: One is to redesign the lower version of h5 interface, and the other is to set the minimum version of the project

Additional knowledge: WebView-Use WebView to access the Url list in turn

Sometimes, we need to use WebView to access the Url list in turn to refresh the web page;

1.1 WebView Creation

webView = (WebView) findViewById(R.id.webview);

1.2 WebView Setup Parameters

  //  Setting cache 
  webView.getSettings().setCacheMode(WebSettings.LOAD_CACHE_ELSE_NETWORK);
  //  Do not set cache 
  // webView.getSettings().setCacheMode(WebSettings.LOAD_NO_CACHE);
  //  Clean up the cache 
  webView.clearCache(true);
  //  Clean up history 
  webView.clearHistory();
  //  Clean up cookies
  CookieSyncManager.createInstance(this);
  CookieSyncManager.getInstance().startSync();
  CookieManager.getInstance().removeSessionCookie();
  //  Settings can support scaling 
  webView.getSettings().setSupportZoom(true);
  //  Sets the presence of the Zoom tool 
  webView.getSettings().setBuiltInZoomControls(true);
  webView.getSettings().setJavaScriptEnabled(true);

1.3 Get the Url list

int index = 0;
 
String [] strList = new String[]{"https://www.ofstack.com",
"https://www.jd.com","https://www.csdn.net",https://www.baidu.com};

1.4 WebView Setting WebViewClient

//  Create directly WebViewClient
  webView.setWebViewClient(new WebViewClient() {
   @Override
   public void onPageFinished(WebView view, String url) {
    super.onPageFinished(view, url);
    index++;
    if(index>artStr.length){
 
    }else {
     webView.clearCache(true);
     webView.clearView();
     Log.i("===onPageFinished====", index + "=======");
     refreshWebpage(index);
    }
   }
  });

1.5 WebView Loads Url

 public void refreshWebpage(int index) {
  String csdnStr = urlStr + artStr[index];
 
  //  Direct call url
  webView.loadUrl(csdnStr);
 }