Showing the main domain first, then jump to subdomain

[xarthurx]

Hello, I'm trying to use this module for my subdomain redirect. Everything works great unless that when visiting my subdomain direction, blog.domain.com, It always shows the domain.com for around 0.5s, then the webpage to jump to the target page...

Is there a way to fix it? Or what might be the possible cause? Thank you.

[hieuhani]

Hi @xarthurx,

Please show me your nuxt.config.ts or how do you configure blog site for me to diagnose the issue

[xarthurx]

Hi @xarthurx,

Please show me your nuxt.config.ts or how do you configure blog site for me to diagnose the issue

import { appDescription } from "./utils/constants";

export default defineNuxtConfig({
    modules: [
        "@vueuse/nuxt",
        "@unocss/nuxt",
        "@pinia/nuxt",
        "dayjs-nuxt",
        "@nuxt/content",
        "vuetify-nuxt-module",
        "@nuxt/image",
        "nuxt-disqus",
        "nuxt-multi-tenancy",
    ],

    // Nuxt3 Native
    // ----------------------------
    spaLoadingTemplate: "./app-loading.html",

    features: {
        inlineStyles: true,
    },

    experimental: {
        // when using generate, payload js assets included in sw precache manifest
        // but missing on offline, disabling extraction it until fixed
        payloadExtraction: false,
        renderJsonPayloads: true,
        typedPages: true,
    },

    css: [
        // "@unocss/reset/tailwind.css",
        // "@unocss/reset/normalize.css",
        "~/assets/css/main.css",
        "~/assets/css/prose.css",
        "~/assets/css/toc.css",
        "~/assets/css/markdown.css",
    ],

    nitro: {
        esbuild: {
            options: {
                target: "esnext",
            },
        },

        // prerender: {
        //  crawlLinks: true,
        //  routes: getMarkdownRoutes(),
        //  // routes: ['/blog', '/blog/**'],
        // routes: ["/"],
        // },
    },

    app: {
        head: {
            viewport: "width=device-width,initial-scale=1",
            link: [
                { rel: "icon", href: "/favicon.ico", sizes: "any" },
                { rel: "icon", type: "image/svg+xml", href: "/favicon.svg" },
                { rel: "apple-touch-icon", href: "/apple-touch-icon.png" },
            ],
            meta: [
                { name: "viewport", content: "width=device-width, initial-scale=1" },
                { name: "description", content: appDescription },
                {
                    name: "apple-mobile-web-app-status-bar-style",
                    content: "black-translucent",
                },
            ],
        },
    },

    devtools: {
        enabled: true,
    },

    // ----------------------------
    // additional Plugin
    // ----------------------------
    content: {
        documentDriven: false,
        experimental: {
            clientDB: true,
        },
    },

    disqus: {
        shortname: "blog-bd-com",
    },

    multiTenancy: {
        rootDomains: [
            "localhost",
            "localhost:3000",
            "localhost:8888",
            "beyond-disciplines.com",
        ],
        sites: ["blog"],
    },
});

And folder structure like this:

[monlasan]

I went on your website and tested it... it's indeed a problem... the question is does it work normally on localhost ?

[xarthurx]

I went on your website and tested it... it's indeed a problem... the question is does it work normally on localhost ?

No, locally the problem is the same... I've tried to debug it for a while before I started this issue.

[hieuhani]

Yes,navigating between root site and sub-domain site requires a full redirect like a normal a href link. I am thinking about a solution for this issue

[xarthurx]

Yes,navigating between root site and sub-domain site requires a full redirect like a normal a href link. I am thinking about a solution for this issue

Why doesn't the demo site have this problem? Is it because I use useAsyncData when loading the directed site?

[monlasan]

Yes,navigating between root site and sub-domain site requires a full redirect like a normal a href link. I am thinking about a solution for this issue

Why doesn't the demo site have this problem? Is it because I use useAsyncData when loading the directed site?

I don't think useAsyncData is the issue here... In the playground source code, useFetch is used in the jobs.localhost:3000 page without any issue.

I don't have this problem either. Can you show the "pages" folder content ? I suspect nuxt-content to be the issue, maybe it cannot work because you defined a "blog" page in the content folder.

Why I say that is because, you can notice that "jobs.nuxtdev.xyz" can also be accessed via "nuxtdev.xyz/jobs". And with nuxt-content; "content/blog/index.md" is routed as "content/blog"

[xarthurx]

Yes,navigating between root site and sub-domain site requires a full redirect like a normal a href link. I am thinking about a solution for this issue

Why doesn't the demo site have this problem? Is it because I use useAsyncData when loading the directed site?

I don't think useAsyncData is the issue here... In the playground source code, useFetch is used in the jobs.localhost:3000 page without any issue.

I don't have this problem either. Can you show the "pages" folder content ? I suspect nuxt-content to be the issue, maybe it cannot work because you defined a "blog" page in the content folder.

Why I say that is because, you can notice that "jobs.nuxtdev.xyz" can also be accessed via "nuxtdev.xyz/jobs". And with nuxt-content; "content/blog/index.md" is routed as "content/blog"

I'm not using document-driven mode. The markdown is manually parsed and rendered with markdown-it.