Nuxt.js: Full-static generated site 404 & then accessing asyncdata

Created on 1 Jul 2020  路  7Comments  路  Source: nuxt/nuxt.js

  • nuxt: v2.13.2
  • node: v14.4.0

Reproduction

First of all let me praise you for the awesome full static mode. Although there are still a few minor things its an awesome addition!

Now to the misbehaviour :) :

my config:

    export: {
      crawler: false, // explicitly turning it off and supplying my needed routes in the routes function
      fallback: true, // It is needed for the 404 page in general as far as I understood the docs
      interval: 100, 
      async routes() {
        const routes = await getApplicationRoutes(false)
        return [
          ...routes.routes,
        ]
      },
      exclude: [/^(?=.*\btest123\b).*$/],
    }

Steps to reproduce

If you got a link somewhere to a page that is not generated, you will get 404 errors trying to fetch a payload for that page.

Seen here:
https://st.immospotter.at/components

You open the page and you will get errors for /components/media as this page does not exist yet but the link is pointing there.

Now if you go to

https://st.immospotter.at/components/media

Of course you would get a 404, but you get:
1 x 404 error for the page itself.
1 x 404 error for the try to fetch a payload for a non existing page.
1 x He still tries to do the request to fetch the data from the api, which ofc as the page doesnt exist results in another 404

What is Expected?

I am not expecting errors trying to fetch payloads of non existing pages.
I am only expecting 1 x 404 Error when i try to access the non existing page in this case /components/media.
I am expecting that he does not try to still do the api call - as he shouldnt do that anymore in full static mode as far as I understood :)

What is actually happening?

see Reproduction.

available soon bug-report

Most helpful comment

I forgot using process.client:

if (!process.dev && process.client && process.static) {
  return
}

All 7 comments

Hi @bstrdChronicles

Thank you for taking the time to write this bug report with the explanations.

1 x 404 error for the page itself.

This is normal

1 x 404 error for the try to fetch a payload for a non existing page.

Actually this is because it hits the SPA fallback, nice catch, I just created https://github.com/nuxt/nuxt.js/pull/7657 to fix this :)

1 x He still tries to do the request to fetch the data from the api, which ofc as the page doesnt exist results in another 404

This is normal SPA fallback behaviour since it can exists on the API but not re-generated yet.

Hey S茅bastien (@Atinux) :)

no problem, i really enjoy Nuxt - so want to help however I can.

Thanks for the Fix guys! :)

What would be the best way to stop the last behaviour in static production mode on pages I like, to not call the API, as I do not want people to know where my data is in some cases.
Is there an internal flag I could check against when in static production?

@bstrdChronicles you can use in asyncData

if (!process.dev && process.static) {
  return
}

Before calling your API, it should do the trick :)

@Atinux hmmm tried it with process.static -> but that would also not allow it in the export/generation step :)
The goal would be to allow it in the building of the pages, but not allow to access the api call once the pages are generated and the app runs.

Any idea how I could solve that? :)

I forgot using process.client:

if (!process.dev && process.client && process.static) {
  return
}

@Atinux haha yeah true, should have thought of that.
Works like a charm now :D - love it!

Thanks S茅bastien!!

You are welcome :)

Was this page helpful?
0 / 5 - 0 ratings

Related issues

danieloprado picture danieloprado  路  3Comments

lazycrazy picture lazycrazy  路  3Comments

bimohxh picture bimohxh  路  3Comments

uptownhr picture uptownhr  路  3Comments

o-alexandrov picture o-alexandrov  路  3Comments