Flutter WebView 4.4.2返回上一页功能失效问题求助

问题原因 #

当前代码未拦截系统返回键事件，WebView自身的页面栈未被优先处理，导致按下返回键时直接触发应用退出逻辑。

解决步骤 #

修改代码，使用WillPopScope包裹Scaffold，拦截返回键事件并判断WebView是否可以返回上一页：

修改后的完整代码 #

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

  @override
  State<Homepage> createState() => _HomepageState();
}

class _HomepageState extends State<Homepage> {
  final _controller = WebViewController()
    ..loadRequest(Uri.parse(websiteURL));

  @override
  Widget build(BuildContext context) {
    return WillPopScope(
      onWillPop: () async {
        // 检查WebView是否存在可返回的历史页面
        if (await _controller.canGoBack()) {
          _controller.goBack();
          return false; // 阻止应用退出
        }
        return true; // 允许应用正常退出
      },
      child: Scaffold(
        appBar: AppBar(title: const Text(appTitle)),
        body: WebViewWidget(controller: _controller),
      ),
    );
  }
}

代码说明 #

• WillPopScope用于拦截Android系统返回键和iOS导航栏返回操作
• onWillPop回调中，通过_controller.canGoBack()判断WebView是否存在历史页面栈
• 若存在可返回页面，调用_controller.goBack()回到上一页，并返回false阻止应用退出
• 若没有历史页面，返回true允许应用正常退出

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