iOS平台webview_flutter弹窗显示about:blank空白页问题求助

问题根源 #

iOS平台上的WebView默认不会自动处理网页触发的新窗口请求（比如target="_blank"的链接或window.open()调用），若未显式配置处理逻辑，会默认打开about:blank空白页；而Android平台通常会有默认的新窗口处理行为，因此出现跨平台差异。

针对webview_flutter的解决方案 #

你的现有代码未处理新窗口创建事件，需补充onCreateWindow回调逻辑：

1. 在NavigationDelegate中添加新窗口处理逻辑
   修改你的WebViewController配置，在setNavigationDelegate的NavigationDelegate里新增onCreateWindow方法：

..setNavigationDelegate(
  NavigationDelegate(
    // 保留你已有的onProgress、onPageStarted等回调
    onCreateWindow: (CreateWindowRequest request) async {
      // 可选方案1：在当前WebView加载新窗口的URL（替换当前页面）
      controller.loadRequest(request.url);
      return true;

      // 可选方案2：跳转到新路由打开独立的WebView页面
      // Navigator.of(currentContext).push(
      //   MaterialPageRoute(
      //     builder: (context) => Scaffold(
      //       appBar: AppBar(title: const Text('新窗口')),
      //       body: WebViewWidget(
      //         controller: WebViewController()
      //           ..setBackgroundColor(UIColors.backgroundPrimary)
      //           ..setJavaScriptMode(JavaScriptMode.unrestricted)
      //           ..loadRequest(request.url),
      //       ),
      //     ),
      //   ),
      // );
      // return true;
    },
  ),
)

2. 配置iOS平台专属参数（可选）
   创建PlatformWebViewControllerCreationParams时，可针对性设置iOS的窗口相关权限：

final params = PlatformWebViewControllerCreationParams(
  ios: IOSWebViewControllerCreationParams(
    allowsLinkPreview: true,
    allowsBackForwardNavigationGestures: true,
  ),
);

针对inappwebview的解决方案 #

若使用inappwebview，需开启多窗口支持并处理新窗口创建事件：

InAppWebView(
  initialUrlRequest: URLRequest(url: Uri.parse(url)),
  initialOptions: InAppWebViewGroupOptions(
    crossPlatform: InAppWebViewOptions(
      javaScriptEnabled: true,
      supportMultipleWindows: true, // 必须开启此选项
    ),
  ),
  onCreateWindow: (controller, createWindowRequest) async {
    // 跳转到新路由展示新窗口内容
    Navigator.of(currentContext).push(
      MaterialPageRoute(
        builder: (context) => Scaffold(
          appBar: AppBar(title: const Text('新窗口')),
          body: InAppWebView(
            initialUrlRequest: URLRequest(url: createWindowRequest.request.url),
          ),
        ),
      ),
    );
    return true;
  },
)

额外排查点 #

• 检查网页触发逻辑：确认网页是通过window.open()还是target="_blank"触发新窗口，部分网页会先打开about:blank再跳转，需确保WebView允许此类跳转。
• 验证Info.plist配置：你的ATS配置已正确添加，可尝试清理App缓存后重新运行。
• 确认JavaScript权限：确保WebView已开启JavaScript（你现有代码中JavaScriptMode.unrestricted已满足要求）。

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