Jetpack Compose 中 WebView 无法显示 JavaScript 弹窗？启用多个窗口支持解决问题！

2024-03-13 03:07:53

## 在 Jetpack Compose 的 WebView 中显示 JavaScript 弹窗

问题：JavaScript 弹窗无法显示

在使用 Jetpack Compose 的 WebView 时，开发者经常会遇到 JavaScript 弹窗无法显示的问题。这是因为默认情况下，WebView 无法自动打开新窗口，导致弹窗被阻止。

解决方法：启用对多个窗口的支持

要解决此问题，只需在 WebView 中启用对多个窗口的支持即可：

settings.setSupportMultipleWindows(true)

这个设置允许 WebView 在当前窗口之外打开新窗口，从而允许 JavaScript 弹窗正常显示。

步骤：在 WebView 中启用多个窗口支持

在 Compose 中创建 WebView。
设置 WebView 的配置。
启用对多个窗口的支持：settings.setSupportMultipleWindows(true)。
为 WebView 加载 URL。

注意事项：安全和隐私影响

启用多个窗口支持可能会对应用程序的安全性和隐私产生影响。因此，确保应用程序仅在需要时才启用此设置非常重要。

完整代码示例

@SuppressLint("SetJavaScriptEnabled")
@Composable
fun WebViewScreen() {
    AndroidView(
        factory = { context ->
            WebView(context).apply {
                layoutParams = ViewGroup.LayoutParams(
                    ViewGroup.LayoutParams.MATCH_PARENT,
                    ViewGroup.LayoutParams.MATCH_PARENT
                )
                settings.apply {
                    javaScriptEnabled = true
                    domStorageEnabled = true
                    javaScriptCanOpenWindowsAutomatically = true
                    setSupportMultipleWindows(true)
                }
                webViewClient = object : WebViewClient() {
                    override fun shouldOverrideUrlLoading(
                        view: WebView?,
                        request: WebResourceRequest?
                    ): Boolean {
                        return false
                    }
                }
                webChromeClient = object : WebChromeClient() {
                    override fun onJsAlert(
                        view: WebView?,
                        url: String?,
                        message: String?,
                        result: JsResult?
                    ): Boolean {
                        result?.confirm()
                        return true
                    }
                }
                loadUrl(PAGE_URL)
            }
        },
        update = {
            it.loadUrl(PAGE_URL)
        }
    )
}

常见问题解答

为什么默认情况下 WebView 不支持多个窗口？
- 这是出于安全考虑，以防止恶意网站打开不受控制的新窗口。
启用多个窗口支持会有什么安全影响？
- 如果应用程序处理用户数据，启用多个窗口支持可能会使应用程序容易受到跨站点脚本攻击。
是否有其他方法可以显示 JavaScript 弹窗？
- 有，可以使用自定义对话框或其他 UI 元素来显示弹窗信息。
我可以在 WebView 中打开任意窗口吗？
- 不，Web 浏览器的安全策略会限制可以在 WebView 中打开的窗口类型。
如何阻止 JavaScript 弹窗？
- 可以使用 JavaScript 执行函数 window.alert() 来阻止 JavaScript 弹窗。