Android WebView如何利用ETag实现合理缓存？

问题根源 #

WebView默认缓存逻辑优先依赖Cache-Control或Expires响应头判断缓存有效期，当服务器未返回这些头时，会启用启发式缓存（默认缓存10分钟以上），但不会自动关联ETag生成If-None-Match请求头，导致无法触发服务器304响应。即使设置LOAD_NO_CACHE，WebView也会跳过缓存逻辑直接重发全量请求，完全忽略ETag机制。

解决方案 #

通过自定义WebViewClient结合OkHttp手动拦截请求、管理ETag与资源缓存，强制实现ETag校验逻辑。

1. 基础配置 #

先开启WebView缓存基础设置：

webView.settings.apply {
    cacheMode = WebSettings.LOAD_DEFAULT
    setAppCacheEnabled(true)
    appCachePath = context.cacheDir.absolutePath
    allowFileAccess = true
}

2. 实现ETag与资源缓存管理 #

用本地存储保存ETag与对应资源内容，这里以SharedPreferences存储ETag、应用缓存目录存储资源为例：

// 存储ETag
private fun saveETag(url: String, eTag: String) {
    context.getSharedPreferences("WebViewETags", Context.MODE_PRIVATE)
        .edit()
        .putString(url, eTag)
        .apply()
}

private fun getETag(url: String): String? {
    return context.getSharedPreferences("WebViewETags", Context.MODE_PRIVATE)
        .getString(url, null)
}

// 存储资源内容
private fun saveResource(url: String, data: ByteArray) {
    val cacheFile = File(context.cacheDir, url.hashCode().toString())
    FileOutputStream(cacheFile).use { it.write(data) }
}

private fun getResource(url: String): File? {
    val cacheFile = File(context.cacheDir, url.hashCode().toString())
    return if (cacheFile.exists()) cacheFile else null
}

3. 自定义WebViewClient拦截请求 #

通过OkHttp手动发起请求，添加If-None-Match头，并处理304响应：

webView.webViewClient = object : WebViewClient() {
    private val okHttpClient = OkHttpClient()

    override fun shouldInterceptRequest(
        view: WebView?,
        request: WebResourceRequest?
    ): WebResourceResponse? {
        request ?: return super.shouldInterceptRequest(view, request)
        val url = request.url.toString()

        // 仅对静态资源（可根据需求调整）启用ETag校验
        if (url.endsWith(".js") || url.endsWith(".css") || url.endsWith(".png") || url.endsWith(".jpg")) {
            val headers = HashMap(request.requestHeaders)
            getETag(url)?.let { headers["If-None-Match"] = it }

            return try {
                val okRequest = Request.Builder()
                    .url(url)
                    .headers(Headers.of(headers))
                    .build()

                val response = okHttpClient.newCall(okRequest).execute()
                handleResponse(url, response)
            } catch (e: IOException) {
                null // 异常时交给WebView默认处理
            }
        }
        return super.shouldInterceptRequest(view, request)
    }

    private fun handleResponse(url: String, response: Response): WebResourceResponse {
        return when (response.code) {
            304 -> {
                // 304时返回本地缓存资源
                getResource(url)?.let { file ->
                    WebResourceResponse(
                        response.header("Content-Type", "application/octet-stream"),
                        response.header("Content-Encoding", "utf-8"),
                        FileInputStream(file)
                    )
                } ?: buildDefaultResponse(response)
            }
            else -> {
                // 200时缓存资源与ETag
                response.body?.bytes()?.let { saveResource(url, it) }
                response.header("ETag")?.let { saveETag(url, it) }
                buildDefaultResponse(response)
            }
        }
    }

    private fun buildDefaultResponse(response: Response): WebResourceResponse {
        return WebResourceResponse(
            response.header("Content-Type", "text/html"),
            response.header("Content-Encoding", "utf-8"),
            response.body?.byteStream()
        )
    }
}

4. 额外注意事项 #

• 可根据业务需求调整需要拦截的资源类型，避免对所有请求都做处理
• 定期清理过期的ETag与缓存文件，防止占用过多存储空间
• Android 10及以上无需额外申请存储权限，应用缓存目录属于私有空间

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