Flutter - 所有路由均未检测到互联网

Question

我正在尝试检测所有路由上的互联网连接丢失，并设法通过在 MaterialApp 中添加构建器来做到这一点，它工作正常，但问题是在重新获得互联网连接后，加载的路由有时是错误的（例如：加载入口路线而不是入门，尽管共享首选项中没有任何内容）。

 return MaterialApp(
      debugShowCheckedModeBanner: false,
      builder: (_, child) => InternetConnectionWrapper(child: child!), // used for displaying no internet screen all across the app
      title: 'X',
      theme: darkTheme(context)
      navigatorKey: navigatorKey,
      routes: routes,
      initialRoute:
          /* no data ? -> login if web, else onBoarding; data available? user -> map screen, workshop-> dashboard screen */
          userData.isNotEmpty ? userData[userType_index] == "user" ? entryPointRoute : dashboardLauncherScreenRoute :  kIsWeb? loginScreenRoute: onboardingScreenRoute,
    );

如何相应实施？谢谢！

检测互联网连接丢失，并在重新建立后，重新加载检测到互联网连接丢失时处于活动状态的相同路由。

Answer 1

从我的角度来看，我会做以下事情。

1. 将

   connectivity_plus

   包添加到依赖项中。

2. 创建一个服务来监听连接变化：

import 'dart:async';
import 'package:connectivity_plus/connectivity_plus.dart';

class ConnectivityService {
  final _connectivity = Connectivity();
  StreamController<ConnectivityResult> connectionStatusController = StreamController<ConnectivityResult>();

  ConnectivityService() {
    _connectivity.onConnectivityChanged.listen((ConnectivityResult result) {
      connectionStatusController.add(result);
    });
  }
}

3. 创建自定义路由观察器：

import 'package:flutter/material.dart';

class CustomRouteObserver extends RouteObserver<PageRoute<dynamic>> {
  String? currentRoute;

  @override
  void didPush(Route<dynamic> route, Route<dynamic>? previousRoute) {
    if (route is PageRoute) {
      currentRoute = route.settings.name;
    }
    super.didPush(route, previousRoute);
  }
}

4. 最后使用

   CustomRouteObserver

   并根据连接性管理导航：

import 'package:flutter/material.dart';

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

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  final GlobalKey<NavigatorState> navigatorKey = GlobalKey<NavigatorState>();
  final routeObserver = CustomRouteObserver();
  final connectivityService = ConnectivityService();

  @override
  void initState() {
    super.initState();
    connectivityService.connectionStatusController.stream.listen((status) {
      if (status == ConnectivityResult.none) {
        navigatorKey.currentState?.pushNamed('/noInternet');
      } else {
        if (routeObserver.currentRoute != null) {
          navigatorKey.currentState?.pushNamed(routeObserver.currentRoute!);
        }
      }
    });
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      navigatorKey: navigatorKey,
      debugShowCheckedModeBanner: false,
      title: 'X',
      theme: ThemeData.dark(),
      routes: {
        '/': (context) => HomeScreen(),
        '/noInternet': (context) => NoInternetScreen(),
        // define other routes
      },
      navigatorObservers: [routeObserver],
    );
  }
}

PS：请确保根据用户数据和平台正确处理初始路线。 CustomRouteObserver 跟踪导航，当连接状态发生变化时，它会相应地重定向。

希望这有帮助。