Horrible redirect kludge to fix login flow, tidy up and readme
This commit is contained in:
@@ -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.
|
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.
|
Check out the [deployment documentation](https://nuxt.com/docs/getting-started/deployment) for more information.
|
||||||
|
|
||||||
# GENESIS STEPS
|
# Steps to Create
|
||||||
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.
|
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
|
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
|
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.
|
||||||
|
|||||||
@@ -1,13 +1,6 @@
|
|||||||
export default defineNuxtRouteMiddleware((to) => {
|
export default defineNuxtRouteMiddleware((to) => {
|
||||||
const user = useSupabaseUser();
|
const user = useSupabaseUser();
|
||||||
if(!user.value && to.path === '/dashboard'){
|
if(!user.value && to.path === '/dashboard'){
|
||||||
console.log('auth - navigating to login (from dashboard)')
|
|
||||||
navigateTo('login');
|
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');
|
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
@@ -1,8 +1,8 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
definePageMeta({
|
definePageMeta({
|
||||||
middleware: ['auth'],
|
middleware: ['auth'],
|
||||||
layout: "authenticated",
|
layout: "authenticated",
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
|
|||||||
@@ -1,7 +1,13 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
definePageMeta({
|
definePageMeta({
|
||||||
middleware: ['auth'],
|
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>
|
</script>
|
||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
|
|||||||
@@ -8,8 +8,9 @@
|
|||||||
async function signInWithGoogle() {
|
async function signInWithGoogle() {
|
||||||
const { data, error } = await supabase.auth.signInWithOAuth({
|
const { data, error } = await supabase.auth.signInWithOAuth({
|
||||||
provider: 'google',
|
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>
|
</script>
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user