Redirect from netlify not working (404 not found) with Nuxt Content in SSG

I migrated a blog to Nuxt 3 (with Nuxt Content) and have some content whose URL has changed : for instance /gitcheatsheet to /goodies/gitcheatsheet

My site is hosted on Netlify, I use static site generation, so I wanted to let Netlify handle the redirection using the configuration or a redirects file. However it does not seem to be working, it is displaying a 404 not found page instead.

My guess is that it's because Nuxt is handling the routing and redirecting to the 404 page. See the code below

<script setup lang="ts">
const {data: page} = await useAsyncData('index', () => queryContent('/').findOne())
if (!page.value) {
  throw createError({statusCode: 404, statusMessage: 'Page not found', fatal: true})
}
</script>

<script setup lang="ts">
const {data: page} = await useAsyncData('index', () => queryContent('/').findOne())
if (!page.value) {
  throw createError({statusCode: 404, statusMessage: 'Page not found', fatal: true})
}
</script>

Here is my netlify.toml file content :

[build]
  command = "pnpm run generate"

[[headers]]
  for = "/*"
  [headers.values]
    X-Robots-Tag = "noindex"

[[redirects]]
  from = "/gitcheatsheet"
  to = "/goodies/gitcheatsheet"
  status = 301
  force = true

[build]
  command = "pnpm run generate"

[[headers]]
  for = "/*"
  [headers.values]
    X-Robots-Tag = "noindex"

[[redirects]]
  from = "/gitcheatsheet"
  to = "/goodies/gitcheatsheet"
  status = 301
  force = true

I have also tried with a _redirects file containing

/gitcheatsheet  /goodies/gitcheatsheet

/gitcheatsheet  /goodies/gitcheatsheet

Does anyone has a cue on how I can make the redirection work?

Nuxt•2y ago•

4 replies

Alexandre Nédélec

Redirect from netlify not working (404 not found) with Nuxt Content in SSG

<script setup lang="ts">
const {data: page} = await useAsyncData('index', () => queryContent('/').findOne())
if (!page.value) {
  throw createError({statusCode: 404, statusMessage: 'Page not found', fatal: true})
}
</script>

<script setup lang="ts">
const {data: page} = await useAsyncData('index', () => queryContent('/').findOne())
if (!page.value) {
  throw createError({statusCode: 404, statusMessage: 'Page not found', fatal: true})
}
</script>

Here is my netlify.toml file content :

[build]
  command = "pnpm run generate"

[[headers]]
  for = "/*"
  [headers.values]
    X-Robots-Tag = "noindex"

[[redirects]]
  from = "/gitcheatsheet"
  to = "/goodies/gitcheatsheet"
  status = 301
  force = true

[build]
  command = "pnpm run generate"

[[headers]]
  for = "/*"
  [headers.values]
    X-Robots-Tag = "noindex"

[[redirects]]
  from = "/gitcheatsheet"
  to = "/goodies/gitcheatsheet"
  status = 301
  force = true

I have also tried with a _redirects file containing

/gitcheatsheet  /goodies/gitcheatsheet

/gitcheatsheet  /goodies/gitcheatsheet

Does anyone has a cue on how I can make the redirection work?

Redirect from netlify not working (404 not found) with Nuxt Content in SSG

Similar Threads

Redirect from netlify not working (404 not found) with Nuxt Content in SSG

Similar Threads

Similar Threads

Similar Threads