Flutter Question posted in
The official Flutter documentation can be found here.

Flutter – App should navigate to home even if internet is off

Currently, I am checking on SplashScreen whether token exist or not, on that basis app navigates to either SignIn or Home.
On Home when I turn off the internet, it shows a dialog that there is no internet connection. By turning it on, the dialog disappears.

The problem is when I close the app and turn off the internet and then open the app it navigates to SignIn. I expect it to be navigated to Home as token is already there.

It works normally when I turn on the internet and visit the app, it navigates to Home directly.

Need an idea to resolve this issue.

Here’s the SplashScreen code for navigating the app.

 Future<void> navigate() async {
    final bearer = await ref.read(bearerTokenProvider.future); // stored in local db

    if (!mounted) return;

    GoRouter.of(context)
        .pushReplacement(bearer != null ? RoutePaths.home : RoutePaths.login);
  }
Tags:

3

Answers


  1. 0

    Did you cache your token when it is validated? If yes then you can just check your cached token while navigating from MaterialApp.

    class _MyAppState extends State<MyApp> {
  String? token;


  @override
  void initState() {
    token = fetchFromCache();
    
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
          ...
          initialRoute: token!=null? "/home": "/splash",
          //or if using home:
          //home: token!=null? HomePage(): SplashPage(),
        );
  }
}
    Login or Signup to reply.
  2. 0

    @Aiman I bet the bearerTokenProvider code is the problem. Either:

    • you are not storing the bearer token to the local db the right way
    • or bearerTokenProvider is not fetching that data correctly

    Please provide the code where you do both

    Login or Signup to reply.
  3. 0

    To ensure that the app navigates to the Home screen when the token exists, regardless of the internet connection status, you can modify the SplashScreen code to check for the presence of the token and navigate accordingly. you can use shared_preferences for this. SharedPreferences is a key-value storage mechanism in Flutter for persistently storing small amounts of data.

    First, make the userSignIn function so that after a user signIn, the token is stored in the cache. I don’t know what your code is like, make it as you want.

     Future<String?> signIn(String email, String password) async {
    // Assume here you have some logic to authenticate the user and retrieve the bearer token
    String? token = await _authenticateUser(email, password);

    // Save the token to SharedPreferences if sign-in is successful
    if (token != null) {
      SharedPreferences prefs = await SharedPreferences.getInstance();
      await prefs.setString('bearerToken', token);
    }

    return token;
  }

    create the singUp function in the same and null the token when user signOut

     Future<void> signOut() async {
    // Remove the token from SharedPreferences
    SharedPreferences prefs = await SharedPreferences.getInstance();
    await prefs.remove('bearerToken');
  }

    to navigate pages, make it like this:

    Future<void> navigate(BuildContext context) async {
SharedPreferences prefs = await SharedPreferences.getInstance();
  
  // Retrieve the bearer token from SharedPreferences
  String? bearer = prefs.getString('bearerToken');

  // Check if the widget is still mounted to avoid setState on disposed widget
  if (!mounted) return;

  // Navigate based on the presence of the bearer token
  Navigator.pushReplacement(
    context,
    MaterialPageRoute(
      builder: (context) => bearer != null ? HomeScreen() : LoginScreen(),
    ),
  );
}
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search