3

I am trying to integrate Supabase Google Auth into my Hybrid app built with Capacitor.

It is working fine for web, but I am not able to get it working for iOS.

There isn't any documentation around this as well.

Opening in browser and failing

I've tried to change the redirect URL as well

supabase?.auth.signInWithOAuth({
                provider: "google",
                options: Capacitor.isNativePlatform()
                ? {
                    redirectTo: "capacitor://localhost",
                }
                : {},
});

This brings me back to the app, but doesn't log me in

Coming back to app but not logging in

Manarjan Singh Ghai
  • 83
  • 1
  • 7
  • I'm unfortunately not familiar with capacitor, but maybe you can find a solution within this React Native example: https://github.com/supabase/supabase/discussions/1717#discussioncomment-4441920 – thorwebdev Mar 16 '23 at 03:10

1 Answers1

1

with capacitor you will have to setup a session manually for mobile for ex redirect to a new page that will handle that

myapp://confirmation

then in this new page

useEffect(() => {
    const hash = window.location.hash;
    const parts = hash.replace('#', '').split('&');
    for (const item of parts) {
        var [key, value] = item.split('=');
        if (key === 'access_token') setAccess(value);
        if (key === 'refresh_token') setRefresh(value);
    }
}, []);
useEffect(() => {
    if (!access || !refresh) return;
    const setSessionfunc = async (access_token: string, refresh_token: string) => {
        await supabase.auth.setSession({ access_token, refresh_token });
        router.push('/');
    };
    setSessionfunc(access, refresh);
}, [access, refresh]);

once the session is set you will be redirected to the home page

keep in mind also that supabase session uses cookies so you will need to add this in your capacitor.config.js

plugins: {
    CapacitorCookies: {
      enabled: true
    } 
}

good luck

Rhicham
  • 21
  • 2