webview 访问 H5 白屏
来源：12-4 H5容器widget封装（二）
给生活一个大大的傻笑
2025-02-12
W/WindowOnBackDispatcher( 5190): OnBackInvokedCallback is not enabled for the application.
W/WindowOnBackDispatcher( 5190): Set 'android:enableOnBackInvokedCallback="true"' in the application manifest.
E/flutter ( 5190): [ERROR:flutter/runtime/dart_vm_initializer.cc(41)] Unhandled Exception: PlatformException(channel-error, Unable to establish connection on channel: "dev.flutter.pigeon.webview_flutter_android.WebView.pigeon_defaultConstructor"., null, null)
E/flutter ( 5190): #0 new WebView.<anonymous closure> (package:webview_flutter_android/src/android_webkit.g.dart:1378:9)
E/flutter ( 5190): <asynchronous suspension>
E/flutter ( 5190):
E/flutter ( 5190): [ERROR:flutter/runtime/dart_vm_initializer.cc(41)] Unhandled Exception: PlatformException(channel-error, Unable to establish connection on channel: "dev.flutter.pigeon.webview_flutter_android.WebView.settings"., null, null)
E/flutter ( 5190): #0 WebView.pigeonVar_settings.<anonymous closure> (package:webview_flutter_android/src/android_webkit.g.dart:1562:9)
E/flutter ( 5190): <asynchronous suspension>
E/flutter ( 5190):
E/flutter ( 5190): [ERROR:flutter/runtime/dart_vm_initializer.cc(41)] Unhandled Exception: PlatformException(channel-error, Unable to establish connection on channel: "dev.flutter.pigeon.webview_flutter_android.WebSettings.setDomStorageEnabled"., null, null)
E/flutter ( 5190): #0 WebSettings.setDomStorageEnabled (package:webview_flutter_android/src/android_webkit.g.dart:2293:7)
E/flutter ( 5190): <asynchronous suspension>
E/flutter ( 5190):
E/flutter ( 5190): [ERROR:flutter/runtime/dart_vm_initializer.cc(41)] Unhandled Exception: PlatformException(channel-error, Unable to establish connection on channel: "dev.flutter.pigeon.webview_flutter_android.WebSettings.setJavaScriptCanOpenWindowsAutomatically"., null, null)
E/flutter ( 5190): #0 WebSettings.setJavaScriptCanOpenWindowsAutomatically (package:webview_flutter_android/src/android_webkit.g.dart:2321:7)
E/flutter ( 5190): <asynchronous suspension>
E/flutter ( 5190):
E/flutter ( 5190): [ERROR:flutter/runtime/dart_vm_initializer.cc(41)] Unhandled Exception: PlatformException(channel-error, Unable to establish connection on channel: "dev.flutter.pigeon.webview_flutter_android.WebSettings.setSupportMultipleWindows"., null, null)
E/flutter ( 5190): #0 WebSettings.setSupportMultipleWindows (package:webview_flutter_android/src/android_webkit.g.dart:2349:7)
E/flutter ( 5190): <asynchronous suspension>
E/flutter ( 5190):
E/flutter ( 5190): [ERROR:flutter/runtime/dart_vm_initializer.cc(41)] Unhandled Exception: PlatformException(channel-error, Unable to establish connection on channel: "dev.flutter.pigeon.webview_flutter_android.WebSettings.setLoadWithOverviewMode"., null, null)
E/flutter ( 5190): #0 WebSettings.setLoadWithOverviewMode (package:webview_flutter_android/src/android_webkit.g.dart:2491:7)
E/flutter ( 5190): <asynchronous suspension>
E/flutter ( 5190):
E/flutter ( 5190): [ERROR:flutter/runtime/dart_vm_initializer.cc(41)] Unhandled Exception: PlatformException(channel-error, Unable to establish connection on channel: "dev.flutter.pigeon.webview_flutter_android.WebSettings.setUseWideViewPort"., null, null)
E/flutter ( 5190): #0 WebSettings.setUseWideViewPort (package:webview_flutter_android/src/android_webkit.g.dart:2520:7)
E/flutter ( 5190): <asynchronous suspension>
E/flutter ( 5190):
E/flutter ( 5190): [ERROR:flutter/runtime/dart_vm_initializer.cc(41)] Unhandled Exception: PlatformException(channel-error, Unable to establish connection on channel: "dev.flutter.pigeon.webview_flutter_android.WebSettings.setDisplayZoomControls"., null, null)
E/flutter ( 5190): #0 WebSettings.setDisplayZoomControls (package:webview_flutter_android/src/android_webkit.g.dart:2549:7)
E/flutter ( 5190): <asynchronous suspension>
E/flutter ( 5190):
E/flutter ( 5190): [ERROR:flutter/runtime/dart_vm_initializer.cc(41)] Unhandled Exception: PlatformException(channel-error, Unable to establish connection on channel: "dev.flutter.pigeon.webview_flutter_android.WebSettings.setBuiltInZoomControls"., null, null)
E/flutter ( 5190): #0 WebSettings.setBuiltInZoomControls (package:webview_flutter_android/src/android_webkit.g.dart:2578:7)
E/flutter ( 5190): <asynchronous suspension>
E/flutter ( 5190):
E/flutter ( 5190): [ERROR:flutter/runtime/dart_vm_initializer.cc(41)] Unhandled Exception: PlatformException(channel-error, Unable to establish connection on channel: "dev.flutter.pigeon.webview_flutter_android.WebChromeClient.pigeon_defaultConstructor"., null, null)
E/flutter ( 5190): #0 new WebChromeClient.<anonymous closure> (package:webview_flutter_android/src/android_webkit.g.dart:4008:9)
E/flutter ( 5190): <asynchronous suspension>
E/flutter ( 5190):
E/flutter ( 5190): [ERROR:flutter/runtime/dart_vm_initializer.cc(41)] Unhandled Exception: PlatformException(channel-error, Unable to establish connection on channel: "dev.flutter.pigeon.webview_flutter_android.WebView.setWebChromeClient"., null, null)
E/flutter ( 5190): #0 WebView.setWebChromeClient (package:webview_flutter_android/src/android_webkit.g.dart:2133:7)
E/flutter ( 5190): <asynchronous suspension>
E/flutter ( 5190):
E/flutter ( 5190): [ERROR:flutter/runtime/dart_vm_initializer.cc(41)] Unhandled Exception: PlatformException(channel-error, Unable to establish connection on channel: "dev.flutter.pigeon.webview_flutter_android.WebSettings.setJavaScriptEnabled"., null, null)
E/flutter ( 5190): #0 WebSettings.setJavaScriptEnabled (package:webview_flutter_android/src/android_webkit.g.dart:2377:7)
E/flutter ( 5190): <asynchronous suspension>
E/flutter ( 5190):
E/flutter ( 5190): [ERROR:flutter/runtime/dart_vm_initializer.cc(41)] Unhandled Exception: PlatformException(channel-error, Unable to establish connection on channel: "dev.flutter.pigeon.webview_flutter_android.WebView.setBackgroundColor"., null, null)
E/flutter ( 5190): #0 WebView.setBackgroundColor (package:webview_flutter_android/src/android_webkit.g.dart:2161:7)
E/flutter ( 5190): <asynchronous suspension>
E/flutter ( 5190):
E/flutter ( 5190): [ERROR:flutter/runtime/dart_vm_initializer.cc(41)] Unhandled Exception: PlatformException(channel-error, Unable to establish connection on channel: "dev.flutter.pigeon.webview_flutter_android.WebViewClient.pigeon_defaultConstructor"., null, null)
E/flutter ( 5190): #0 new WebViewClient.<anonymous closure> (package:webview_flutter_android/src/android_webkit.g.dart:2923:9)
E/flutter ( 5190): <asynchronous suspension>
E/flutter ( 5190):
E/flutter ( 5190): [ERROR:flutter/runtime/dart_vm_initializer.cc(41)] Unhandled Exception: PlatformException(channel-error, Unable to establish connection on channel: "dev.flutter.pigeon.webview_flutter_android.DownloadListener.pigeon_defaultConstructor"., null, null)
E/flutter ( 5190): #0 new DownloadListener.<anonymous closure> (package:webview_flutter_android/src/android_webkit.g.dart:3836:9)
E/flutter ( 5190): <asynchronous suspension>
E/flutter ( 5190):
E/flutter ( 5190): [ERROR:flutter/runtime/dart_vm_initializer.cc(41)] Unhandled Exception: PlatformException(channel-error, Unable to establish connection on channel: "dev.flutter.pigeon.webview_flutter_android.WebViewClient.setSynchronousReturnValueForShouldOverrideUrlLoading"., null, null)
E/flutter ( 5190): #0 WebViewClient.setSynchronousReturnValueForShouldOverrideUrlLoading (package:webview_flutter_android/src/android_webkit.g.dart:3779:7)
E/flutter ( 5190): <asynchronous suspension>
E/flutter ( 5190):
E/flutter ( 5190): [ERROR:flutter/runtime/dart_vm_initializer.cc(41)] Unhandled Exception: PlatformException(channel-error, Unable to establish connection on channel: "dev.flutter.pigeon.webview_flutter_android.WebView.setWebViewClient"., null, null)
E/flutter ( 5190): #0 WebView.setWebViewClient (package:webview_flutter_android/src/android_webkit.g.dart:2020:7)
E/flutter ( 5190): <asynchronous suspension>
E/flutter ( 5190): #1 Future.wait.<anonymous closure> (dart:async/future.dart:534:21)
E/flutter ( 5190): <asynchronous suspension>
E/flutter ( 5190): #2 AndroidWebViewController.setPlatformNavigationDelegate (package:webview_flutter_android/src/android_webview_controller.dart:489:5)
E/flutter ( 5190): <asynchronous suspension>
E/flutter ( 5190):
E/flutter ( 5190): [ERROR:flutter/runtime/dart_vm_initializer.cc(41)] Unhandled Exception: PlatformException(channel-error, Unable to establish connection on channel: "dev.flutter.pigeon.webview_flutter_android.WebView.loadUrl"., null, null)
E/flutter ( 5190): #0 WebView.loadUrl (package:webview_flutter_android/src/android_webkit.g.dart:1663:7)
E/flutter ( 5190): <asynchronous suspension>
E/flutter ( 5190):
E/flutter ( 5190): [ERROR:flutter/runtime/dart_vm_initializer.cc(41)] Unhandled Exception: PlatformException(error, java.lang.IllegalStateException: Trying to create a platform view of unregistered type: plugins.flutter.io/webview
E/flutter ( 5190): at io.flutter.plugin.platform.PlatformViewsController.createPlatformView(PlatformViewsController.java:509)
E/flutter ( 5190): at io.flutter.plugin.platform.PlatformViewsController$1.createForTextureLayer(PlatformViewsController.java:197)
E/flutter ( 5190): at io.flutter.embedding.engine.systemchannels.PlatformViewsChannel$1.create(PlatformViewsChannel.java:128)
E/flutter ( 5190): at io.flutter.embedding.engine.systemchannels.PlatformViewsChannel$1.onMethodCall(PlatformViewsChannel.java:55)
E/flutter ( 5190): at io.flutter.plugin.common.MethodChannel$IncomingMethodCallHandler.onMessage(MethodChannel.java:267)
E/flutter ( 5190): at io.flutter.embedding.engine.dart.DartMessenger.invokeHandler(DartMessenger.java:292)
E/flutter ( 5190): at io.flutter.embedding.engine.dart.DartMessenger.lambda$dispatchMessageToQueue$0$io-flutter-embedding-engine-dart-DartMessenger(DartMessenger.java:319)
E/flutter ( 5190): at io.flutter.embedding.engine.dart.DartMessenger$$ExternalSyntheticLambda0.run(Unknown Source:12)
E/flutter ( 5190): at android.os.Handler.handleCallback(Handler.java:959)
E/flutter ( 5190): at android.os.Handler.dispatchMessage(Handler.java:100)
E/flutter ( 5190): at android.os.Looper.loopOnce(Looper.java:232)
E/flutter ( 5190): at android.os.Looper.loop(Looper.java:317)
E/flutter ( 5190): at android.app.ActivityThread.main(ActivityThread.java:8705)
E/flutter ( 5190): at java.lang.reflect.Method.invoke(Native Method)
E/flutter ( 5190): at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:580)
E/flutter ( 5190): at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:886)
E/flutter ( 5190): , null, null)
E/flutter ( 5190): #0 StandardMethodCodec.decodeEnvelope (package:flutter/src/services/message_codecs.dart:648:7)
E/flutter ( 5190): #1 MethodChannel._invokeMethod (package:flutter/src/services/platform_channel.dart:334:18)
E/flutter ( 5190): <asynchronous suspension>
E/flutter ( 5190): #2 SurfaceAndroidViewController._sendCreateMessage (package:flutter/src/services/platform_views.dart:1040:30)
E/flutter ( 5190): <asynchronous suspension>
E/flutter ( 5190): #3 AndroidViewController.create (package:flutter/src/services/platform_views.dart:827:5)
E/flutter ( 5190): <asynchronous suspension>
E/flutter ( 5190):
写回答
1回答
-
CrazyCodeBoy
2025-02-12
你的问题是 Flutter WebView 在 Android 端白屏，且报错 Unable to establish connection on channel，这是 webview_flutter 在 Android 端的 PlatformView 没有正确初始化导致的。
可能的原因：
1. WebView 依赖未正确初始化
2. WebView 插件版本不兼容
3. Android 平台 PlatformView 没有正确注册
4. WebView 权限或设置问题
5. 缺少 android:enableOnBackInvokedCallback="true"
解决方案：
1. 确保 webview_flutter 插件的版本兼容
请确保 webview_flutter 相关插件是最新的，特别是 webview_flutter_android 和 webview_flutter_platform_interface：
dependencies:
flutter:
sdk: flutter
webview_flutter: ^4.4.4
webview_flutter_android: ^3.10.4
webview_flutter_wkwebview: ^3.10.4
然后运行：
flutter clean
flutter pub get
2. 在 AndroidManifest.xml 里添加 WebView 权限
打开 android/app/src/main/AndroidManifest.xml，确保你添加了 WebView 相关权限：
<uses-permission android:name="android.permission.INTERNET"/>
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
并且在 <application> 标签内添加：
<application
android:usesCleartextTraffic="true"
android:enabledOnBackInvokedCallback="true">
</application>
3. 确保 WebView 组件已正确初始化
在 main.dart 的 main() 方法里添加：
import 'package:flutter/material.dart';
import 'package:webview_flutter/webview_flutter.dart';
void main() {
WidgetsFlutterBinding.ensureInitialized();
WebView.platform = SurfaceAndroidWebView(); // 重要
runApp(MyApp());
}
4. 使用 WebViewWidget 而不是 WebView
从 webview_flutter 4.x 版本开始，建议使用 WebViewWidget 代替 WebView：
import 'package:flutter/material.dart';
import 'package:webview_flutter/webview_flutter.dart';
class WebViewExample extends StatefulWidget {
@override
State<WebViewExample> createState() => _WebViewExampleState();
}
class _WebViewExampleState extends State<WebViewExample> {
late final WebViewController controller;
@override
void initState() {
super.initState();
controller = WebViewController()
..setJavaScriptMode(JavaScriptMode.unrestricted)
..setBackgroundColor(const Color(0x00000000))
..loadRequest(Uri.parse('https://www.example.com'));
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text('WebView Test')),
body: WebViewWidget(controller: controller),
);
}
}
5. 在 Android 端使用 onAttachedToActivity
如果你在 webview_flutter 插件中发现 PlatformException(channel-error, Unable to establish connection) 相关错误，可以尝试在 MainActivity.kt 里初始化： 修改 android/app/src/main/kotlin/com/example/yourapp/MainActivity.kt
package com.example.yourapp
import io.flutter.embedding.android.FlutterActivity
import io.flutter.embedding.engine.FlutterEngine
import io.flutter.plugins.GeneratedPluginRegistrant
class MainActivity: FlutterActivity() {
override fun configureFlutterEngine(flutterEngine: FlutterEngine) {
GeneratedPluginRegistrant.registerWith(flutterEngine)
}
}
6. 在 gradle.properties 启用多进程
打开 android/gradle.properties 并添加：
android.enableJetifier=true
android.useAndroidX=true
7. 关闭 WebView 硬件加速
某些情况下，硬件加速会导致 WebView 白屏，可以尝试禁用：
<application
android:hardwareAccelerated="false">
</application>
总结
更新 webview_flutter 相关依赖
在 main.dart 初始化 WebView.platform = SurfaceAndroidWebView();
确保 AndroidManifest.xml 添加 INTERNET 权限
在 Android 端正确注册 FlutterActivity
尝试 WebViewWidget 代替 WebView
在 gradle.properties 启用 Jetifier 和 AndroidX
你可以先试试这些方法，看看能否解决问题，如果仍然不行，可以提供你的 Flutter doctor -v 和 webview_flutter 版本信息，以便进一步排查问题！00
相似问题