Horrible redirect kludge to fix login flow, tidy up and readme

This commit is contained in:
Michael Dausmann
2023-01-02 20:53:04 +11:00
parent 0dbc33a145
commit edd65f1301
5 changed files with 21 additions and 19 deletions

View File

@@ -1,4 +1,4 @@
# Nuxt 3 Minimal Starter
# Nuxt 3 Minimal Starter + Supabase + OAuth
Look at the [Nuxt 3 documentation](https://nuxt.com/docs/getting-started/introduction) to learn more.
@@ -41,8 +41,8 @@ npm run preview
Check out the [deployment documentation](https://nuxt.com/docs/getting-started/deployment) for more information.
# GENESIS STEPS
This is what I did to create the boilerplate, it is here for your interest and for my memory, you don't need to repeat these.
# Steps to Create
This is what I did to create the project including all the extra fiddly stuff. Putting this here so I don't forget.
Follow instructions from here https://nuxt.com/docs/getting-started/installation
@@ -69,3 +69,5 @@ modules: ['@nuxtjs/supabase']
```
Follow these instructions to add google oath https://supabase.com/docs/guides/auth/social-login/auth-google
Then I frigged around trying to get the nuxt-supabase module to work properly for the oauth flow. It's a bit of a mess TBH.

View File

@@ -1,13 +1,6 @@
export default defineNuxtRouteMiddleware((to) => {
const user = useSupabaseUser();
if(!user.value && to.path === '/dashboard'){
console.log('auth - navigating to login (from dashboard)')
navigateTo('login');
} else if(user.value && to.path === '/') {
console.log('auth - navigating to dashboard (from root)')
navigateTo('dashboard');
} else if(user.value && to.path === '/login') {
console.log('auth - navigating to dashboard (from login)')
navigateTo('dashboard');
}
})

View File

@@ -2,6 +2,12 @@
definePageMeta({
middleware: ['auth'],
});
//horrible horrible kludge from https://github.com/nuxt-modules/supabase/issues/28#issuecomment-1353070523
const user = useSupabaseUser();
watchEffect(async () => {
if (user.value) await navigateTo("dashboard");
});
</script>
<template>
<div>

View File

@@ -8,8 +8,9 @@
async function signInWithGoogle() {
const { data, error } = await supabase.auth.signInWithOAuth({
provider: 'google',
// options: { redirectTo: 'dashboard'} // the redirectTo option doesn't work
})
navigateTo('dashboard'); // This doesn't work, it navigates prior to the login handshake completing and then the handshake lands on the index page and ignores the middleware.
// navigateTo('dashboard'); // This doesn't work, it navigates prior to the oauth handshake completing and then the handshake lands on the index page and ignores the middleware.
}
</script>