N
Nuxt2mo ago
DAQEM

SSR issue

When I use npm run dev the script is run on the server side. But when I use it in docker (production), the script is run on the client side. How to do I make them both run on the server side only?
<template>
<div class="relative z-0">
<Header :user="user" />
<div class="px-4 min-h-[50vh]">
<slot />
</div>
<Footer />
</div>
</template>

<script lang="ts" setup>
import Footer from "../components/Footer.vue";

const auth = await getAuth();
const user = auth.value?.user ?? null;
</script>

<style></style>
<template>
<div class="relative z-0">
<Header :user="user" />
<div class="px-4 min-h-[50vh]">
<slot />
</div>
<Footer />
</div>
</template>

<script lang="ts" setup>
import Footer from "../components/Footer.vue";

const auth = await getAuth();
const user = auth.value?.user ?? null;
</script>

<style></style>
3 Replies
JuanP Barba
JuanP Barba2mo ago
What do you mean with “the script”? Do you mean to all the <script> tag?
DAQEM
DAQEM2mo ago
Yeah especially getAuth() @JuanP Barba maybe this helps: https://github.com/DAQEM/Asteria/blob/main/layouts/default.vue
JuanP Barba
JuanP Barba2mo ago
Oh! It helps a lot! I see that you are executing this from the layout… First of all, the code in the tag should always be running on both sides. It’s strange that it’s only running in one place or another pending on the environment. Executing this only at SSR will break on client side if you introduce a new layout My advice when working with authentication would be to avoid server-side rendering (SSR) as much as possible, to reduce the complexity that authentication already involves. If you need to execute some code only at server, I would suggest to do it in a plugin using .server notation.