Nuxt 3 broken error page handling on direct URL call

[peter-neumann-dev]

Environment

• Operating System: Darwin
• Node Version: v20.9.0
• Nuxt Version: 3.8.2
• CLI Version: 3.10.0
• Nitro Version: 2.8.1
• Package Manager: [email protected]
• Builder: -
• User Config: devtools
• Runtime Modules: -
• Build Modules: -

Reproduction

https://stackblitz.com/edit/github-k9tmde?file=README.md

Describe the bug

The error page in Nuxt 3 stops working with this plugin enabled. A normal invalid NuxtLink is working, but if you call something not existing manually from e.g. the browser bar. The 404 error is not handled by Nuxt anymore.

After removing the server plugin compression.ts this is working again.

Additional context

I have linked a minimal demo on StackBlitz, but I had to download the project and use it locally to get the error. It could be related to how StackBlitz is handling the localhost URLs.

Logs

No response

[bernhardberger]

can confirm. Just stumbled upon this one myself.

I've solved it this way to exclude nuxt internal /__nuxt/ routes:

import { useCompression } from 'h3-compression'

export default defineNitroPlugin((nitro) => {
  nitro.hooks.hook('render:response', async (response, { event }) => {
    if (response.headers?.['content-type'].startsWith('text/html') && !event?.context?.matchedRoute?.path.startsWith('/__nuxt')) {
      await useCompression(event, response)
    }
  })
})

[LeTraceurSnork]

Same problem here. @bernhardberger solution helped, but seems like that kind of check should already be included into plugin itself @CodeDredd

[CodeDredd]

@LeTraceurSnork I am goind to update the readme soon. At the end it's not a plugin (yet) 😉

[entropin]

I used 

`import { useCompression } from "h3-compression";

export default defineNitroPlugin((nitro) => {
  nitro.hooks.hook("render:response", async (response, { event }) => {
    if (!response.headers?.["content-type"]?.startsWith("text/html")) return;

    // If readable is false, it causes an error, dont know why, but the only time it happes seams to be on errors?
    if (!event.node.req.readable) {
      return;
    }

    await useCompression(event, response);
  });
});
`

To fix this error, do you know if this is a valid fix also?

[CodeDredd]

@entropin This questions beats me. I dont know, but it looks good for me.