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.
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 ?