! GhostvOne.tv 👻🇫🇷 Comments

! GhostvOne.tv 👻🇫🇷

Explore posts from servers

DIAdiscord.js - Imagine an app NNuxt FFilament

•Created by ! GhostvOne.tv 👻🇫🇷 on 4/1/2024 in #❓・help

Middleware called 3 times instead of 2 ? (stackblitz reproduction)

Here my real middleware I think you will understand

import type { FetchApiRedirectInterface } from '~/assets/js/interfaces/FetchApiRedirectInterface'

export default defineNuxtRouteMiddleware(async (to, from) => {
    if (process.client && from && from.meta.key === to.meta.key) return
    const nuxtApp = useNuxtApp()
    if (nuxtApp.isHydrating) return

    const mainResourceCategorySlug = to.params
        .main_resource_category_slug as string | undefined
    const resourceCategorySlug = to.params.resource_category_slug as
        | string
        | undefined

    if (!mainResourceCategorySlug && !resourceCategorySlug) {
        return
    }

    const categoryStore = useCategoryStore()

    // Send slug to API and check if it's fine or redirection needed
    const response = await useCheckResourceCategorySlug({
        category_id: categoryStore.category!.id,
        main_resource_category_slug: mainResourceCategorySlug,
        resource_category_slug: resourceCategorySlug ?? null,
        fetch_type: 'fetch', // its use useFetch here
    })

    const data = response.data.value as FetchApiRedirectInterface


    const localePath = useLocalePath()
    if (!data) {
        return navigateTo(localePath('/'))
    }

    if (data.redirect) {
        return navigateTo(localePath(data.redirect), {
            redirectCode: data.code,
        })
    }
})

import type { FetchApiRedirectInterface } from '~/assets/js/interfaces/FetchApiRedirectInterface'

export default defineNuxtRouteMiddleware(async (to, from) => {
    if (process.client && from && from.meta.key === to.meta.key) return
    const nuxtApp = useNuxtApp()
    if (nuxtApp.isHydrating) return

    const mainResourceCategorySlug = to.params
        .main_resource_category_slug as string | undefined
    const resourceCategorySlug = to.params.resource_category_slug as
        | string
        | undefined

    if (!mainResourceCategorySlug && !resourceCategorySlug) {
        return
    }

    const categoryStore = useCategoryStore()

    // Send slug to API and check if it's fine or redirection needed
    const response = await useCheckResourceCategorySlug({
        category_id: categoryStore.category!.id,
        main_resource_category_slug: mainResourceCategorySlug,
        resource_category_slug: resourceCategorySlug ?? null,
        fetch_type: 'fetch', // its use useFetch here
    })

    const data = response.data.value as FetchApiRedirectInterface


    const localePath = useLocalePath()
    if (!data) {
        return navigateTo(localePath('/'))
    }

    if (data.redirect) {
        return navigateTo(localePath(data.redirect), {
            redirectCode: data.code,
        })
    }
})

When i try to go on a page with wrong slugs, here this middleware is calling 3 times. If I put everything here in my setup page instead of here my middleware, api is called only two times

15 replies

NNuxt

•Created by ! GhostvOne.tv 👻🇫🇷 on 4/1/2024 in #❓・help

Middleware called 3 times instead of 2 ? (stackblitz reproduction)

My middleware is making an api request to check slugs in the link. If I put this logic in my middleware, it does 3 API calls. If I put this logic in page setup, only two (as intended). What i'm understing in Nuxt, middleware shouldn't be used If I have redirection and API call ? If I use middleware for that atm, it does one more call for nothing

15 replies

NNuxt

•Created by ! GhostvOne.tv 👻🇫🇷 on 4/1/2024 in #❓・help

Middleware called 3 times instead of 2 ? (stackblitz reproduction)

Like it works If I put the script in the setup instead of the middleware

15 replies

NNuxt

•Created by ! GhostvOne.tv 👻🇫🇷 on 4/1/2024 in #❓・help

Middleware called 3 times instead of 2 ? (stackblitz reproduction)

Only A is hard loading. It should be A -> A -> Middleware -> Redirecting to B -> Middleware -> Showing B

15 replies

NNuxt