Home > Mobile >  flutter - supabase password recover
flutter - supabase password recover

Time:12-14

i am trying to implement supabase password recovey for a client . sadly i was unable thus far.

i followed guides provided in web site on this page

then i take a look at guides provided at this repo

but i was unable to make it work .

here is my supabase auth settings supabase auth setting,ong

and here is my supabase and supabaseAuth initialization

void main() async {
 
 WidgetsFlutterBinding.ensureInitialized();
 
 await Supabase.initialize(
   url: 'SITEURL',
   anonKey:
       'ANONKEY',
       authCallbackUrlHostname: 'ADDITIONAL AUTH CALLBACK REDIRECT'
 );
 //initializing supabaseAuth we use it for password recovery
 await SupabaseAuth.initialize(
   authCallbackUrlHostname: 'ADDITIONAL AUTH CALLBACK REDIRECT ',

 );
 //runnig the app
 runApp(const MyApp());
}

note that by ADDITIONAL AUTH CALLBACK REDIRECT i mean the full (SITEURL ://reset-callback)

here is my androidManifest.xml intent

<intent-filter>
              <action android:name="android.intent.action.VIEW" />
              <category android:name="android.intent.category.DEFAULT" />
              <category android:name="android.intent.category.BROWSABLE" />
              <!-- Accepts URIs that begin with YOUR_SCHEME://YOUR_HOST -->
              <data
                android:scheme="SITEURL"
                android:host="//reset-callback" />
            </intent-filter>

in the app i first navigate to a page called AuthPage where there is a button that takes the user to a ResetPage where user enters his email and call resetpassword method

Future<void> resetPassword(String email) async {
    try {
      final response =
          await Supabase.instance.client.auth.api.resetPasswordForEmail(
        'email',
        options: supabase.AuthOptions(
          redirectTo: 'Additional Auth Callback Redirect'
        )
      );
      
      debugPrint('reset response ${response}');
    } catch (error) {
      message = error.toString();
      debugPrint(message);
    }
  }

which takes the user back to AuthPage in Auth Page i have StreamBuilder which listens to SupabaseAuth.onAuthStateChange and if the chage is passwordRecover it shows a TextField and a button for the user to reset his password implemented like below

StreamBuilder(
          stream: SupabaseAuth.instance.onAuthChange,
          builder: (context, AsyncSnapshot<AuthChangeEvent> snapshot) {
            print('snap shot auth state changed to ${snapshot.data.toString()}');
            if (snapshot.data == AuthChangeEvent.passwordRecovery) {
              return Column(
                children: [
                  const Text('Set New Password'),
                  TextField(
                    controller: controller,
                    decoration: const InputDecoration(
                      filled: true,
                    ),
                  ),
                  ElevatedButton(
                    onPressed: () {
                      if (controller.text.isEmpty ||
                          controller.text.length < 8) {
                        return;
                      }
                      Supabase.instance.client.auth
                          .update(
                              UserAttributes(password: controller.text.trim()))
                          .catchError((error) {
                            ScaffoldMessenger.of(context).showSnackBar(SnackBar(content: Text('ERROR : $error')));
                          })
                          .then((value) => Navigator.of(context)
                              .pushReplacement(MaterialPageRoute(
                                  builder: (ctx) => const AuthScreen())));
                    },
                    child: const Text('Submit'),
                  ),
                ],
              );
            } else {
              SomeOtherWidget(),
            }
          })

having done all that problem arises when the i put in my email and when the recovery link is emailed to me it show nothing i opened the link both in my desktop browser and in my emulator browser and even my real phone the response is like below response_browser

response_emulator

i am sure that user exist as it is shown in users section in supabase

i dont know what i am doing wrong and i dont know how to proceed with app recognizing type=recovery parameter in url . any help would be much appreciated .

CodePudding user response:

I fixed the problem by changing host name turns out I was setting it wrong in manifest and one more thing is that supabase only allows deeplinks with io.supabase.whatever As host

  • Related