Nuxt•2y ago

nuxt3 & supabase safety

hey, i use supabase with nuxt3, when i do inserts to supabase should i make this via api? How secure is the javascript in my .vue files. I have following code in my pages/events.vue to create an event

<script setup>
const client = useSupabaseClient()
const user = useSupabaseUser()
const title = ref('')
const description = ref('')
const link = ref('')
const startDate = ref(null)
const endDate = ref(null)
const type = ref('')
const userLimit = ref(null)

const step = ref(1)

const createEvent = async () => {
    const error = await client.from('events').insert({ title: title.value, description: description.value, link: link.value, start_date: startDate.value, end_date: endDate.value, type: type.value, user_limit: userLimit.value, created_by: user.value.id })
}

useHead({
    title: 'Create Event · SMEA'
})
definePageMeta({
    layout: 'dashboard',
    middleware: 'auth'
});
</script>

<script setup>
const client = useSupabaseClient()
const user = useSupabaseUser()
const title = ref('')
const description = ref('')
const link = ref('')
const startDate = ref(null)
const endDate = ref(null)
const type = ref('')
const userLimit = ref(null)

const step = ref(1)

const createEvent = async () => {
    const error = await client.from('events').insert({ title: title.value, description: description.value, link: link.value, start_date: startDate.value, end_date: endDate.value, type: type.value, user_limit: userLimit.value, created_by: user.value.id })
}

useHead({
    title: 'Create Event · SMEA'
})
definePageMeta({
    layout: 'dashboard',
    middleware: 'auth'
});
</script>

Can this code be modified from client side to maybe change that user.value.id ? If yes i think this is more safe to do it via api where the user id gets set on server side to prevent users posting as another user if they have the id maybe i could to it with serverSupabaseClient https://supabase.nuxtjs.org/usage/services/server-supabase-client the demo uses also the client side stuff inside the vue files https://github.com/nuxt-modules/supabase/blob/main/demo/pages/tasks.vue

Nuxt Supabase

serverSupabaseClient | Nuxt Supabase

Supabase integration for Nuxt.

GitHub

supabase/tasks.vue at main · nuxt-modules/supabase

Supabase module for Nuxt. Contribute to nuxt-modules/supabase development by creating an account on GitHub.

6 Replies

Unknown User•2y ago

Message Not Public

🇨🇭 Marko Bolliger <cannap>•2y ago

@shanehoban do you do this for all requests?

🇨🇭 Marko Bolliger <cannap>•2y ago

RAVEN•2y ago

hey, yeah i guess you have to do it for everything to make the access controlled for example to prevent inserting with a different user_id - so users can not post stuff in the name (or id) of another user

Unknown User•2y ago

Message Not Public

RAVEN•2y ago

yee i know @🇨🇭 Marko Bolliger <cannap> asked @Scratchy

Gaming

Programming

nuxt3 & supabase safety