Go_router can't find route for deep link with fragment(#)

82 Views Asked by At

I'm creating a flutter mobile app app with Supabase as backend. I'm struggling with code responsible for resetting password. When user opens deep link generated by supabase, go_router can't display appropriate route because there is a fragment added to deep link.

In supabase_flutter package function resetPasswordForEmail accepts [redirectTo] parameter. I pass to it a path of route. But app opens that path with fragment(#) added with information about authentication session.

Here is a simplified example, where I simply go to route with fragment(#) instead of deep link:

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

void main() => runApp(MyApp());

GoRouter router = GoRouter(routes: [
  GoRoute(
      path: '/',
      builder: (context, _) => const PasswordResetLinkPage(title: 'Password Reset Link')),
  GoRoute(path: '/passwordReset', builder: (context, _) => const PasswordResetFormPage())
]);

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp.router(
      title: 'Flutter Demo',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      routerConfig: router,
    );
  }
}

class PasswordResetLinkPage extends StatefulWidget {
  final String title;

  const PasswordResetLinkPage({
    super.key,
    required this.title,
  }) : super();

  @override
  State<PasswordResetLinkPage> createState() => _PasswordResetLinkPageState();
}

class _PasswordResetLinkPageState extends State<PasswordResetLinkPage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: Text(widget.title),
      ),
      body: Center(
        child: TextButton(
        child: const Text('Reset your password'),onPressed: () => context.go('/passwordReset/#access_token=qwerty') 
      ),
     
    ));
  }
}

class PasswordResetFormPage extends StatelessWidget{
  const PasswordResetFormPage({super.key}) : super();
  
  @override
  Widget build(BuildContext context){
   return Scaffold(
    appBar: AppBar(title: const Text('Provide new password')),
     body: const Column(children: [TextField(), TextField()])
   ); 
  }
}

I've tried to check if path has a fragment, and if yes, go to password reset form inside top level redirection, but redirection is done before deep link is processed.

GoRouter(
  routes: ...,
  redirect: (context, state){
    if(state.uri.fragment.isNotEmpty) return '/passwordReset';
  }
);

Go_router's logs are something like this:


[GoRouter] going to /passwordReset

[GoRouter] No initial matches : /passwordReset/#access_token=qwerty

My question is there any way to reflect fragments inside route's path, and how to make it work?

0

There are 0 best solutions below