Uzyxen Posts - Answer Overflow

Uzyxen

•Created by Uzyxen on 11/17/2024 in #❓・help

middleware

I created a middleware in which I send an api request and validate the JWT token. In the vue app I have a token download from the serwer. App.vue

<script setup>
  const { useAccessToken } = useAuth();
  const token = useAccessToken();

    const { data } = await useFetch('/api/auth/refresh', {
      method: 'post'
    });
    if(data.value.access_token) {
      token.value = data.value.access_token;
    }
</script>

<script setup>
  const { useAccessToken } = useAuth();
  const token = useAccessToken();

    const { data } = await useFetch('/api/auth/refresh', {
      method: 'post'
    });
    if(data.value.access_token) {
      token.value = data.value.access_token;
    }
</script>

in composables I have useAuth.js with:

export default () => {
    const useAccessToken = () => useState('access_token');

    return {
        useAccessToken
    }
}

export default () => {
    const useAccessToken = () => useState('access_token');

    return {
        useAccessToken
    }
}

And id middleware authUser.ts:

const { useAccessToken } = useAuth();

export default defineNuxtRouteMiddleware(async (to, from) => {
    const token: any = useAccessToken();

    console.log(token);

    if(!token.value) {
        //return navigateTo('/logowanie');
    } else {
        const response = await $fetch('/api/auth/getAuthUser', {
            headers: {
                authorization: `Bearer ${token.value}` 
            }
        });

        if(!response) {
            return navigateTo('/logowanie');
        }
    }
});

const { useAccessToken } = useAuth();

export default defineNuxtRouteMiddleware(async (to, from) => {
    const token: any = useAccessToken();

    console.log(token);

    if(!token.value) {
        //return navigateTo('/logowanie');
    } else {
        const response = await $fetch('/api/auth/getAuthUser', {
            headers: {
                authorization: `Bearer ${token.value}` 
            }
        });

        if(!response) {
            return navigateTo('/logowanie');
        }
    }
});

My problem is that during SSR the "token.value" is undefined so even if user is logged he will be navigated to /login page.

10 replies

NNuxt

•Created by Uzyxen on 11/4/2024 in #❓・help

useFetch server-side

how to send api request via useFetch only server-side?

10 replies

NNuxt

•Created by Uzyxen on 11/3/2024 in #❓・help

$fetch from client vs from server

I've got a problem with $fetch in Nuxt.js with ASP.NET. When i use $fetch (method: 'delete' straight straight from client it ends with the error "BLOCKED_BY_CLIENT" but when I send api request to the nitro endpoint and then request to ASP.NET it works. Could someone explain to me why?

11 replies

Gaming

Programming