Setting up Supabase Google OAuth with Capacitor (android)

Capacitor
1

Can somehow help implementing this? I’ve been trying everything but can’t get it to work…

→ I think I have to set flowType to pkce?

export const supabase = createClient(supabaseUrl, supabaseAnonKey, {
	auth: {
		flowType: 'pkce',
	},

→ I enabled cookies; do I have anything else to facilitate this?

    "CapacitorCookies": {
      "enabled": true
    }

→ I set up Google Cloud console + Supabase correctly. When running:

  const signInWithProvider = async (provider) => {
    const redirectTo = 'com.myapp.myapp://auth';
    const { error } = await supabase.auth.signInWithOAuth({
      provider,
      options: { redirectTo },
    });
    if (error) console.error(error);
  };

→ I’m getting back a response containing access_token, code, id_token (with user data); etc.

I’ve tried setSession and However I’m unable to turn this into a session:

const { data, error } = supabase.auth.setSession({ access_token: varA, refresh_token: varB });

I’ve also tried exchangeCodeForSession but I always run into errors.

await supabase.auth.exchangeCodeForSession(code)

It’s unclear to me how I can use the response from Google to start a session; supposedly the session should be created by the supabase client but I can’t make it work.

Could someone please walk me through the correct implementation of this?

2
4

If you take the time to search the docs, it shows the answer you seek. and yes this has nothing to do with capacitor or ionic.

5

@Henk007 Did you ever get this working? Any tips? Struggling as well

7

Appreciate the response!

9

Would love a little write up when you have time. Still would be super beneficial to me. Never got it working.

Thanks!

11

:clap: I’ll give it a shot in the next few days. Thanks so much!

12

It worked! You don’t even know how many hours I sunk into this. Think the key for me was mainly using the App.addListener as I believe I had most of the other intricacies in place.

Regardless thank you very much for all the detail.

15

@Henk007 Can you please share your solution? I’m also trying to make it work, but no success at this point :disappointed:
Thank you!

16

can you share the solution please :pray:

17

Solution

  useEffect(() => {
    const listener = App.addListener('appUrlOpen', async (data) => {
      const url = new URL(data.url)
      const params = new URLSearchParams(url.hash.substring(1)) // remove the leading '#'

      await supa.auth.setSession({
        access_token: params.get('access_token') || '',
        refresh_token: params.get('refresh_token') || '',
      })
    })
    return () => {
      listener.remove()
    }
  }, [])