atinux / nuxt-auth-utils

Add Authentication to Nuxt applications with secured & sealed cookies sessions.
MIT License
973 stars 91 forks source link

Question: defineOAuthGoogleEventHandler - onSuccess never called #276

Closed roseyda closed 1 week ago

roseyda commented 1 week ago

Hello,

I'm trying to implement authentification using nuxt-auth-utils (v0.5.2) with Google provider in a nuxt (v3.14.159) project. I have set NUXT_OAUTH_GOOGLE_CLIENT_ID and NUXT_OAUTH_GOOGLE_CLIENT_SECRET in my .env file according to my app created in Google API Console

Then I created an handler : server/api/auth/google.get.ts : export default defineOAuthGoogleEventHandler({ async onSuccess(event, { user }) { console.log('πŸš€ ~ onSuccess ~ user:', user); console.log('πŸš€ ~ onSuccess ~ event:', event); await setUserSession(event, { user }); return sendRedirect(event, '/'); }, async onError(event, error) { console.log('πŸš€ ~ onError ~ error:', error); console.log('πŸš€ ~ onError ~ event:', event); return sendRedirect(event, '/'); }, });

And on my App.vue I added a simple link : <div v-if="!loggedIn"> <a href="/api/auth/google" type="button"> Sign in with Google </a> </div>

When clicking on this link I am properly redirected to Google authentification. Once authenticated, I'm redirected to localhost:3000?code=xxxxx&scope=xxx&authuser=0&prompt=none but still not loggedIn <script setup lang="ts"> const { loggedIn, user } = useUserSession(); watchEffect(() => { console.log('πŸš€ ~ watchEffect ~ loggedIn.value:', loggedIn.value); console.log('πŸš€ ~ watchEffect ~ user.value:', user.value); }); </script> => loggedIn remain false, user stay undefined and neither onSuccess nor onError have been called.

What did I've done wrong ?

roseyda commented 1 week ago

Analysing the provider code, I understood my issue, I set the redirect URI to http://localhost:3000/api/auth/google And now everything work