supabase / supabase-js

An isomorphic Javascript client for Supabase. Query your Supabase database, subscribe to realtime events, upload and download files, browse typescript examples, invoke postgres functions via rpc, invoke supabase edge functions, query pgvector.
https://supabase.com
MIT License
2.86k stars 220 forks source link

Provider login refreshes page after callback? #109

Closed xavidram closed 3 years ago

xavidram commented 3 years ago

Bug report

Describe the bug

When calling the supabase.auth.signIn({ provider }) method, after the provider redirect, the response payload returns to the login page, but a sudden page refresh occurs, causing the response to result in a null state. It does not happen when the grant_type is password, only when trying to use a provider login. The local storage session is properly set.

To Reproduce

Steps to reproduce the behavior, please provide code snippets or a repository:

  1. Go to https://github.com/Anstroy/alacena-vue-3.git
  2. Clone the repo and install dependencies and add supabase url and key
  3. Start repo using yarn serve
  4. Try logging in using a provider.
  5. Take a look at the console. The console.log within services/supabase login function should output the response, but you will see it outputs the response then suddenly swaps to null, due to what seems like a sudden page refresh.

Expected behavior

Response from callback should return to the callback URL and a page refresh after the site has returned should not occur?

Screenshots

Will work on getting screenshots.

System information

kiwicopple commented 3 years ago

a sudden page refresh occurs

Hey @ykdojo - are you seeing this behaviour in your Vue app?

xavidram commented 3 years ago

The reason I want to catch the response from the authorization is to set the reactive state. And the login page has a route guard to prevent authenticated users to access the login page. When the call returns from the 3rd party login page, it returns to the login page, which does not have a user loaded into the reactive state. My work around for now is to check the localstorage for the session and shove it into the state at that point and time if it gets back to the login page.

ykdojo commented 3 years ago

@kiwicopple when I log in using an OAuth provider (GitHub) on our Vue to-do example app, I do see the login page being shown for a split second after the redirect - but I'm not sure if it's the same thing as what @xavidram described here.

@xavidram - I tried reproducing your bug, but it seems like you've made some changes to your codebase since you filed this issue here - could you tell me which commit I can reproduce this bug on?

xavidram commented 3 years ago

@ykdojo The current commit should produce the same issue. On login, the provider redirects me to the Github page, then redirects me back.

The route guard doesn't seem to protect the route on return from the provider callback. So I need to sit and tinker with it some more. I am going to close this issue. I need to find a workaround for collecting the authenticated payload from the providers, and do some handling on my end.

seenickcode commented 2 years ago

@xavidram do you remember any solution to this?

xavidram commented 2 years ago

No. I never got it to work so I just built my own auth server for the project.

seenickcode commented 2 years ago

Ok thanks.

th-m commented 8 months ago

I actually just dealt with this today. It was a heck of a pain to debug. Turns out it is mostly harmless to the user, and I am keeping it as a feature for now.

Pfurr commented 7 months ago

some issue (only) with supabase.auth.signInWithOAuth({provider}) ---> i m working with next js and PKCE