Flutter如何通过webviewcontroller拦截url

我在Flutter中使用WebViewController加载网页时，需要根据特定规则拦截部分URL。比如当用户点击链接或页面自动跳转时，如何通过WebViewController实现URL拦截并执行自定义逻辑？目前尝试了onPageStarted和shouldOverrideUrlLoading回调，但拦截效果不稳定，有时会漏掉重定向的URL。求教正确的拦截姿势和常见问题解决方案。

2 回复

在Flutter中，使用WebViewController拦截URL可通过setNavigationDelegate方法实现。在navigationDelegate回调中检查URL，根据需求返回NavigationDecision.prevent阻止加载或NavigationDecision.navigate允许加载。

更多关于Flutter如何通过webviewcontroller拦截url的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


在Flutter中，可以通过WebViewController拦截URL，主要使用setNavigationDelegate方法设置导航代理，并在回调中处理拦截逻辑。以下是具体步骤和示例代码：

步骤

  1. 创建WebViewController实例。
  2. 使用setNavigationDelegate设置导航代理。
  3. 在onNavigationRequest回调中检查URL，决定是否允许加载。

示例代码

import 'package:flutter/material.dart';
import 'package:webview_flutter/webview_flutter.dart';

class WebViewExample extends StatefulWidget {
  const WebViewExample({super.key});

  @override
  State<WebViewExample> createState() => _WebViewExampleState();
}

class _WebViewExampleState extends State<WebViewExample> {
  late final WebViewController controller;

  @override
  void initState() {
    super.initState();
    controller = WebViewController()
      ..setNavigationDelegate(NavigationDelegate(
        onNavigationRequest: (NavigationRequest request) {
          // 拦截逻辑：检查URL
          if (request.url.startsWith('https://example.com/block')) {
            // 阻止加载特定URL
            return NavigationDecision.prevent;
          }
          // 允许其他URL加载
          return NavigationDecision.navigate;
        },
      ))
      ..loadRequest(Uri.parse('https://example.com'));
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('WebView拦截URL')),
      body: WebViewWidget(controller: controller),
    );
  }
}

关键点说明

  • onNavigationRequest：在每次导航请求时触发，接收NavigationRequest对象，包含url属性。
  • NavigationDecision.prevent：阻止URL加载。
  • NavigationDecision.navigate：允许URL加载。

拦截场景

  • 阻止特定域名或路径。
  • 重定向到其他页面（通过拦截后调用controller.loadRequest加载新URL）。
  • 提取URL参数进行处理。

使用此方法可灵活控制WebView的导航行为。

回到顶部