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');
        }
    }
});

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');
        }
    }
});

Fetch + External API issue

Fetch + External API issue

Continue the conversation

Nuxt

Continue the conversation

Nuxt

Similar Threads