Nuxt•5mo ago

Fetch + External API issue

Hello, I'm developing a front-end under nuxt and an api under AdonisJS. I have a /api/v1/me route that returns the information for a user associated with a bearer token. When I call the fetch method, I can see in my browser that it responds with a 200, but Nuxt tells me a 404 I think it's because I have a Caddy server with two reverse proxies, /api/v1 is redirected to my AdonisJS app and the rest to Nuxt. Here's my current middleware:

import type {User} from "~/src/stores/auth";

export default defineNuxtRouteMiddleware(async (to, from) => {
    if (!to.path.startsWith('/clientarea')) {
        return;
    }

    const store = useAuthStore();
    if(!store.isLoggedIn) {
        return navigateTo('/auth/login');
    }

    const token = store.user?.token;
    if (!token || token.expires_at < new Date()) {
        return navigateTo('/auth/login');
    }

    try {
        const response = await $fetch('/api/v1/me', {
            headers: {
                Authorization: `Bearer ${token.token}`
            }
        });

        const user = await response as User;
        store.setUser(user);
    } catch (e) {
        if(e) {
            console.log('Logout User !')
            //await store.logout();
            //return navigateTo('/auth/login');
        }
    }
});

import type {User} from "~/src/stores/auth";

export default defineNuxtRouteMiddleware(async (to, from) => {
    if (!to.path.startsWith('/clientarea')) {
        return;
    }

    const store = useAuthStore();
    if(!store.isLoggedIn) {
        return navigateTo('/auth/login');
    }

    const token = store.user?.token;
    if (!token || token.expires_at < new Date()) {
        return navigateTo('/auth/login');
    }

    try {
        const response = await $fetch('/api/v1/me', {
            headers: {
                Authorization: `Bearer ${token.token}`
            }
        });

        const user = await response as User;
        store.setUser(user);
    } catch (e) {
        if(e) {
            console.log('Logout User !')
            //await store.logout();
            //return navigateTo('/auth/login');
        }
    }
});

4 Replies

Nolan•5mo ago

The weird thing is that if I put a console.log after store.setUser(user);, it displays fine but I still get the triggered catch... Is it possible that the nuxt server is trying to do the fetch since I have SSR enabled?

Nolan•5mo ago

Nolan•5mo ago

(This is the nuxt console, not browser console) (fixed)

Gaming

Programming

Fetch + External API issue