Prerender triggers custom server middlewares during building

[royorange]

Environment

• Operating System: Docker
• Node Version: v22.14.0
• Nuxt Version: 3.16.1
• CLI Version: 3.23.1
• Nitro Version: 2.11.7
• Package Manager: [email protected]
• Builder: -
• Runtime Modules: @nuxt/[email protected], @nuxt/[email protected], @vueuse/[email protected], @pinia/[email protected]
• Build Modules: -

Version

3.5.1

Reproduction

https://stackblitz.com/edit/nuxt-starter-ytmet9gf?file=package.json

run npm run build, an unexpected index.html is generated under .output/public/__nuxt_content/content/sql_dump/ which break the dump file

Description

When using @nuxt/content v3.5.1 in a production environment, I've discovered some critical issues:

1. Server Middleware Interference with Content Build: During the Nuxt Content build process, server middleware authentication code is unexpectedly triggered (because of the prerender), causing the generated SQL dump to be corrupted (my scene is to redirect to the login site). This leads to the Base64 decoding error in the browser when trying to load the content collection.

2. Error file cached in the localstorage: The wrong sql_dump file cached in the localStorage, so even I updated the site, because the checksum returns the same result, the website will not be corrected only when the user clear the localstorage.

Steps to Reproduce:

Create a Nuxt app with @nuxt/content v3.4.0

1. Add authentication middleware in the server directory
2. Set up content collection with markdown documents
3. Build for production
4. Try to access content in the browser via queryCollectionNavigation or similar methods Error appears in console: Failed to execute 'atob' on 'Window': The string to be decoded is not correctly encoded

It works after I added some condition like:

export default defineEventHandler(async (event) => {
  const url = getRequestURL(event)
  if (import.meta.server && process.env.NODE_ENV !== 'production'){
    return
  }
  if (authFailed) {
    return sendRedirect(event, '/login', 302)
  }
  ..... 
})

I think when building the project, since the v3 is build with db, validate the dump file is necessary and can help debug some issue, cause its really cost me large time to find why the content is missing. It's also necessary to check or clear the cache when decompression the db failed.

Additional context

I closed the minify and added some logs when calling the method like:

const { data: navigation, status, error } = await useAsyncData('docs-navigation', () => queryCollectionNavigation('docs'))

and when i check the output directory, the sql_dump has turned to some html strings

Logs

Collection error: H3Error: Failed to execute 'atob' on 'Window': The string to be decoded is not correctly encoded.
    at decompressSQLDump (BikjZArz.js:14:38)
    at loadCollectionDatabase (BikjZArz.js:141:24)
    at async loadAdapter (BikjZArz.js:61:7)
    at async Object.all (BikjZArz.js:69:7)
    at async queryContentSqlClientWasm (Dv-FZBtf.js:680:16)
    at async generateNavigationTree (Dv-FZBtf.js:441:27)
    at async setup (B7DE7cKw.js:4206:18)Caused by: InvalidCharacterError: Failed to execute 'atob' on 'Window': The string to be decoded is not correctly encoded.
    at decompressSQLDump (BikjZArz.js:14:38)
    at loadCollectionDatabase (BikjZArz.js:141:24)
    at async loadAdapter (BikjZArz.js:61:7)
    at async Object.all (BikjZArz.js:69:7)
    at async queryContentSqlClientWasm (Dv-FZBtf.js:680:16)
    at async generateNavigationTree (Dv-FZBtf.js:441:27)
    at async setup (B7DE7cKw.js:4206:18)

[royorange]

I've created PR #3342 that addresses this issue by:

• Adding validation for sql_dump after prerendering
• Resetting localStorage when decompression fails

[github-actions[bot]]

This issue is stale because it has been open 60 days with no activity. Remove stale label or comment or this will be closed in 30 days.

[farnabaz]

Hello @royorange, Your workaround is the correct solution. Since your middleware applies to all requests in your application, it also affects Nuxt pre-render requests. As expected, during pre-rendering, authentication will fail, resulting in an incorrect dump.

If you don't want to protect Content routes, you can ignore all routes that start with /__nuxt_content/:

export default defineEventHandler(async (event) => {
  const url = getRequestURL(event)
  if (url.startsWith('/__nuxt_content/')) {
    return
  }
  if (authFailed) {
    return sendRedirect(event, '/login', 302)
  }
  // ...
})

[github-actions[bot]]

This issue is stale because it has been open 60 days with no activity. Remove stale label or comment or this will be closed in 30 days.

[github-actions[bot]]

This issue was closed because it has been stalled for 30 days with no activity.