Flutter点击图标启动外部Chrome，按返回键同步关闭Flutter与Chrome应用

url_launcher的launchUrlString返回值仅标识外部应用跳转请求是否发起成功，无法感知用户从Chrome返回Flutter的时机，需要结合Flutter应用生命周期监听实现返回即退出的逻辑。

实现逻辑 #

• 页面State混入WidgetsBindingObserver，注册应用前后台状态监听
• 新增标记位记录Chrome是否拉起成功，避免应用初始启动时误触发退出
• 监听到应用从后台切回前台（即用户从Chrome返回Flutter）时，调用系统方法关闭Flutter应用
• 页面销毁时移除生命周期监听，避免内存泄漏

完整代码 #

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:url_launcher/url_launcher_string.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatefulWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> with WidgetsBindingObserver {
  /// 标记是否已成功拉起外部Chrome，防止初始启动误退出
  bool _hasLaunchedExternalBrowser = false;

  @override
  void initState() {
    super.initState();
    WidgetsBinding.instance.addObserver(this);
    _loadTargetWebsite();
  }

  @override
  void dispose() {
    WidgetsBinding.instance.removeObserver(this);
    super.dispose();
  }

  @override
  void didChangeAppLifecycleState(AppLifecycleState state) {
    super.didChangeAppLifecycleState(state);
    // 从Chrome切回Flutter时直接退出应用
    if (state == AppLifecycleState.resumed && _hasLaunchedExternalBrowser) {
      SystemNavigator.pop();
    }
  }

  Future<void> _loadTargetWebsite() async {
    const targetUrl = 'https://www.google.com';
    if (await canLaunchUrlString(targetUrl)) {
      _hasLaunchedExternalBrowser = await launchUrlString(
        targetUrl,
        mode: LaunchMode.externalApplication,
      );
    }
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Website launch from logo',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(primarySwatch: Colors.blue),
      home: const Scaffold(body: SizedBox.shrink()),
    );
  }
}

补充说明 #

• 你当前使用的url_launcher: ^6.1.4版本无需调整，完全兼容上述实现
• 该逻辑同时适配Android与iOS平台：Android端SystemNavigator.pop()会正常销毁应用退回桌面；iOS端遵循平台规范返回桌面，符合App Store审核要求
• 可将Scaffold背景色设置为与应用启动页一致，优化跳转前的视觉体验，避免白屏闪烁

内容的提问来源于stack exchange，提问作者MORE AKASH