Android WebView仅显示网站蓝色背景无内容，iOS WebView正常

Hey Michael, let's figure out why your Android WebView is only showing that blue background without loading any content, while the same site works perfectly on iOS. From the code snippet you shared and common WebView gotchas, here are the top fixes to test out:

You mentioned enabling JavaScript, but there are a few critical settings that are often missing and can break modern websites:

• DOM Storage: Most sites rely on localStorage or sessionStorage for data, and Android WebView has this disabled by default.
• Mixed Content Handling: If your target site mixes HTTP and HTTPS resources, Android 8.0+ blocks this by default, which can prevent key assets from loading.
• User-Agent Spoofing: Some sites serve different content based on the device's UA string. The default WebView UA might be recognized as an outdated browser, leading to incompatible content.

Here's an updated configuration snippet:

WebSettings webSettings = mWebView.getSettings();
webSettings.setJavaScriptEnabled(true);
// Enable DOM storage for site data
webSettings.setDomStorageEnabled(true);
// Allow mixed content (only if your site needs it)
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
    webSettings.setMixedContentMode(WebSettings.MIXED_CONTENT_COMPATIBILITY_MODE);
}
// Set a mobile Chrome UA to mimic a real browser
webSettings.setUserAgentString("Mozilla/5.0 (Linux; Android 10; SM-G973F) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/91.0.4472.120 Mobile Safari/537.36");

The default WebViewClient doesn't give you visibility into loading errors or handle internal links properly. Adding a custom one will help you diagnose issues and keep navigation within the WebView:

mWebView.setWebViewClient(new WebViewClient() {
    @Override
    public void onPageFinished(WebView view, String url) {
        super.onPageFinished(view, url);
        // Log to confirm the page finished loading
        Log.d("WebViewStatus", "Page fully loaded: " + url);
    }

    @Override
    public void onReceivedError(WebView view, WebResourceRequest request, WebResourceError error) {
        super.onReceivedError(view, request, error);
        // Catch errors to see what's failing to load
        Log.e("WebViewError", "Error Code: " + error.getErrorCode() + " | Message: " + error.getDescription());
    }

    @Override
    public boolean shouldOverrideUrlLoading(WebView view, WebResourceRequest request) {
        // Force all links to open in the current WebView instead of external browsers
        view.loadUrl(request.getUrl().toString());
        return true;
    }
});

If your target site uses HTTPS, Android WebView is stricter about SSL certificates than iOS. If the site has a self-signed, expired, or misconfigured certificate, WebView will block content from loading. For testing purposes, you can temporarily bypass this (never do this in production!):

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
    mWebView.setWebViewClient(new WebViewClient() {
        @Override
        public void onReceivedSslError(WebView view, SslErrorHandler handler, SslError error) {
            // Only use this for testing to confirm SSL is the issue
            handler.proceed();
            // In production, call handler.cancel() and show an error to the user
        }
    });
}

Android 7.0+ uses the Chrome browser's kernel for WebView. If the device has an outdated Chrome version, it might not support modern web features the site uses. Ask users to update Chrome on their device, or ensure your app doesn't restrict WebView updates.

Corrupted cache can cause unexpected loading issues. Clear it before loading the site:

mWebView.clearCache(true);
mWebView.clearHistory();

内容的提问来源于stack exchange，提问作者Michael