深入理解Android WebView的加载流程与事件回调

文章目录

• • [一、WebView 加载流程时序图](#一、WebView 加载流程时序图)
  • [二、WebView 加载流程回调函数说明](#二、WebView 加载流程回调函数说明)
  • 三、`AwContents`
  • • [3.1 主要功能和职责](#3.1 主要功能和职责)
    • [3.2 架构和实现](#3.2 架构和实现)
    • [3.3 使用场景](#3.3 使用场景)
  • 四、利用WebView回调函数检测白屏
  • • [4.1 使用`onPageStarted`和`onPageFinished`检测加载时间](#4.1 使用onPageStarted和onPageFinished检测加载时间)
    • [4.2 利用`onReceivedError`和`onReceivedHttpError`检测加载错误](#4.2 利用onReceivedError和onReceivedHttpError检测加载错误)
    • [4.3 使用`shouldInterceptRequest`监控资源加载](#4.3 使用shouldInterceptRequest监控资源加载)
    • [4.4 使用`onPageCommitVisible`](#4.4 使用onPageCommitVisible)
    • [4.5 结合JavaScript和`evaluateJavascript`](#4.5 结合JavaScript和evaluateJavascript)
  • 五、结论

在Android开发中，WebView用于显示网页和执行JavaScript。理解其加载流程和事件回调对于开发一个功能丰富且用户友好的基于Web的应用至关重要。本文将详细介绍 WebView 加载一个URL时的整个流程和相关的事件回调，帮助开发者更好地掌握其使用方法和处理可能出现的问题。

一、WebView 加载流程时序图

当用户通过 WebView 加载一个URL时，整个过程涉及多个组件和一系列复杂的交互。下面是一个 WebView 加载URL的时序图，以及对每个回调事件的详细说明。
用户 WebView WebViewClient Native层 (AwContents) loadUrl() nativeLoadUrl() 页面加载开始 onPageStarted() 页面开始加载时调用，通知应用页面加载已经开始。 shouldInterceptRequest (多次) WebView每次请求资源时调用，允许应用拦截、修改或替换资源请求。 onLoadResource (多次) 加载页面资源时调用，通知应用页面资源正在加载。 onFormResubmission() 用户尝试重新提交表单时调用，询问用户是否重新提交表单。 onReceivedHttpAuthRequest() 需要HTTP认证时调用，请求HTTP认证信息。 onReceivedClientCertRequest() 服务器请求客户端证书时调用，提供客户端证书。 onReceivedSslError() SSL验证失败时调用，处理SSL错误。 onReceivedHttpError() HTTP错误响应时调用，处理HTTP错误。 onTooManyRedirects() 页面重定向过多时调用，处理重定向问题。 onSafeBrowsingHit() 访问到被谷歌标记为不安全的网页时调用，处理安全浏览警告。 shouldOverrideUrlLoading() WebView即将加载某个URL时调用，决定是否由应用而非WebView处理该URL。 shouldOverrideKeyEvent() onUnhandledKeyEvent() onScaleChanged() onPageCommitVisible() 页面内容即将显示时调用，通知页面内容即将可见。 页面开始显示 onPageFinished() 页面加载完成时调用，通知应用页面加载已经完成。 页面加载完成 用户 WebView WebViewClient Native层 (AwContents)

上面的时序图提供了一个清晰的视图，展示了从开始加载URL到页面加载完成的整个过程中WebView和WebViewClient的交互。每个回调都在特定的时机被触发，以处理不同的事件和状态变化。

二、WebView 加载流程回调函数说明

1. 触发加载

   用户或应用触发 loadUrl() 方法，开始加载指定的URL。

2. 原生层处理
   WebView 调用其底层实现（通常是 AwContents 的 nativeLoadUrl() 方法）来开始网络请求。

3. 页面加载的各阶段

• 页面加载开始 ：此时，WebViewClient 的 onPageStarted() 方法被调用，标志着页面加载的开始。
• 资源请求拦截 ：shouldInterceptRequest() 方法可能会被多次调用，允许开发者拦截、修改或替换正在加载的资源。
• 资源加载 ：对于页面上的每个资源（如图片、CSS文件等），onLoadResource() 方法会被调用。

4. 处理特殊事件
   在加载过程中，WebView 可能会遇到各种需要特殊处理的情况：

• 表单重提交 ：onFormResubmission() 被调用，询问用户是否重新提交表单。
• HTTP认证请求 ：onReceivedHttpAuthRequest() 请求HTTP认证信息。
• 客户端证书请求 ：onReceivedClientCertRequest() 提供客户端证书。
• SSL错误处理 ：onReceivedSslError() 处理SSL验证失败的情况。
• HTTP错误处理 ：onReceivedHttpError() 处理HTTP错误响应。
• 重定向过多 ：onTooManyRedirects() 处理页面重定向问题。
• 安全浏览命中 ：onSafeBrowsingHit() 处理访问到被标记为不安全的网页。

5. 页面内容显示

• 页面即将可见 ：onPageCommitVisible() 方法被调用，标志着页面内容即将显示在屏幕上。
• 页面加载完成 ：最终，onPageFinished() 方法被调用，通知应用页面已完全加载。

每个回调方法都有其特定的用途，例如，shouldOverrideUrlLoading() 允许开发者决定是否拦截URL加载，而 onScaleChanged() 则用于处理缩放事件。正确处理这些回调可以极大地增强应用的功能性和用户体验。

三、AwContents

本节介绍时序图中的AwContents。AwContents 是 Android WebView 的一个核心组件，它在 Android WebView 架构中扮演着非常重要的角色。AwContents 是 Chromium 项目的一部分，它负责管理 WebView 的内容渲染和事件处理。在 Android 系统中，AwContents 作为 WebView 的底层实现，提供了与 Chromium 引擎的直接交互接口。

3.1 主要功能和职责

1. 内容渲染 ：
   AwContents 负责将网页内容渲染到 WebView 组件上。它使用 Chromium 的渲染引擎（Blink）来解析 HTML、CSS 和 JavaScript，确保网页内容能够正确显示。

2. 事件处理 ：

   它处理来自上层 WebView 和 WebViewClient 的各种事件和请求，如页面加载、资源请求、导航事件等，并将这些事件转发到 Chromium 引擎。

3. JavaScript 交互 ：
   AwContents 提供了与 JavaScript 代码交互的接口，允许 Android 应用与网页中的 JavaScript 代码进行通信。

4. 安全和隐私 ：

   它实现了多种安全措施，如同源策略、内容安全策略等，以保护用户的安全和隐私。

5. 网络请求管理 ：
   AwContents 管理所有网络请求，包括图片、CSS 文件、JavaScript 文件等资源的加载。它支持自定义网络请求的处理，例如通过 shouldInterceptRequest() 方法拦截和修改请求。

3.2 架构和实现

AwContents 是一个桥接类，它连接了 Android 的 WebView API 和 Chromium 的底层实现。在 Android WebView 的架构中，AwContents 位于 Java 层和 native 层之间，它通过 JNI（Java Native Interface）与 native 代码进行交互。

在 native 层，AwContents 对应的实现是 content::WebContents，这是 Chromium 中用于管理网页内容的核心类。WebContents 负责页面的生命周期管理、渲染进程管理和页面内容的实际渲染。

3.3 使用场景

开发者通常不直接与 AwContents 交互，而是通过 WebView 提供的高级 API 来进行开发。然而，了解 AwContents 的工作原理对于解决 WebView 中的高级问题、性能优化以及实现自定义功能非常有帮助。

AwContents 是 Android WebView 中的一个关键组件，它使得 WebView 能够利用 Chromium 引擎的强大功能，提供高性能和高兼容性的网页浏览体验。

四、利用WebView回调函数检测白屏

在Android开发中，使用WebView时偶尔会遇到白屏问题，这通常是由于网页加载不完全、资源加载失败或者JavaScript错误等原因引起的。利用WebView的回调函数可以帮助我们检测并诊断这种白屏问题。以下是一些策略和步骤，展示如何使用WebView的回调函数来检测白屏：

4.1 使用onPageStarted和onPageFinished检测加载时间

白屏可能是因为页面加载时间过长。通过记录onPageStarted和onPageFinished之间的时间差，可以判断页面是否在合理的时间内完成加载。

webView.setWebViewClient(new WebViewClient() {
    long startTime;

    @Override
    public void onPageStarted(WebView view, String url, Bitmap favicon) {
        super.onPageStarted(view, url, favicon);
        startTime = System.currentTimeMillis();
    }

    @Override
    public void onPageFinished(WebView view, String url) {
        super.onPageFinished(view, url);
        long loadTime = System.currentTimeMillis() - startTime;
        if (loadTime > ACCEPTABLE_LOAD_TIME) {
            // 记录或处理加载时间过长的情况
        }
    }
});

4.2 利用onReceivedError和onReceivedHttpError检测加载错误

这些回调函数可以帮助我们捕获在加载过程中发生的错误，这些错误可能会导致页面内容无法正确显示，从而出现白屏。

webView.setWebViewClient(new WebViewClient() {
    @Override
    public void onReceivedError(WebView view, WebResourceRequest request, WebResourceError error) {
        super.onReceivedError(view, request, error);
        // 处理加载错误
    }

    @Override
    public void onReceivedHttpError(WebView view, WebResourceRequest request, WebResourceResponse errorResponse) {
        super.onReceivedHttpError(view, request, errorResponse);
        // 处理HTTP错误
    }
});

4.3 使用shouldInterceptRequest监控资源加载

如果关键资源（如CSS或JavaScript文件）加载失败，可能会导致页面显示不完整或白屏。通过shouldInterceptRequest可以监控这些资源的加载情况。

webView.setWebViewClient(new WebViewClient() {
    @Override
    public WebResourceResponse shouldInterceptRequest(WebView view, WebResourceRequest request) {
        // 检查请求的资源，记录加载失败的资源
        return super.shouldInterceptRequest(view, request);
    }
});

4.4 使用onPageCommitVisible

onPageCommitVisible在页面内容即将显示时调用，如果在这个阶段页面内容为空或不完整，可能是一个白屏的迹象。

webView.setWebViewClient(new WebViewClient() {
    @Override
    public void onPageCommitVisible(WebView view, String url) {
        super.onPageCommitVisible(view, url);
        // 检查页面内容是否可见或部分内容是否缺失
    }
});

4.5 结合JavaScript和evaluateJavascript

通过注入JavaScript代码检查DOM元素的存在或内容，可以帮助确认页面是否正确渲染。

webView.evaluateJavascript("(function() { return document.body.innerHTML; })();", new ValueCallback<String>() {
    @Override
    public void onReceiveValue(String html) {
        if (html.isEmpty()) {
            // 处理白屏情况
        }
    }
});

通过上述方法，结合日志记录和异常处理机制，可以有效地检测和诊断WebView中的白屏问题。这些技术不仅可以帮助开发者提高应用的稳定性和用户体验，还可以在开发和测试阶段快速定位问题。

五、结论

WebView 的加载流程涉及复杂的交互和多个阶段，每个阶段都可能触发不同的事件回调。作为开发者，理解这些过程和回调的时机及其作用是非常重要的。这不仅可以帮助我们更有效地使用 WebView，还可以在开发过程中预见并解决潜在问题，从而创建更加稳定和可靠的应用。