Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Nuxt 3 broken error page handling on direct URL call #4

Open
peter-neumann-dev opened this issue Dec 10, 2023 · 5 comments
Open

Nuxt 3 broken error page handling on direct URL call #4

peter-neumann-dev opened this issue Dec 10, 2023 · 5 comments

Comments

@peter-neumann-dev
Copy link

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
Copy link

bernhardberger commented Dec 27, 2023

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
Copy link

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

@CodeDredd
Copy link
Owner

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

@entropin
Copy link

entropin commented Jul 6, 2024

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
Copy link
Owner

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

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

5 participants