Getting Nuxt error handling function with Apache

Question

Try to learn Nuxt, some wine and some water as a Swedish proverb says.

I got som problem with the error handling, when I build app (no problem in dev). Looks like it do not live so good with Apache and its.htaccess file. This is my.htaccess:

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.html [L]
</IfModule>

The basic error handling function (error.vue in site root), for an example if I go to http://nuxtshop.localhost/xyz/zyz , it triggers. But its the error with createError function that do not trigger right, it just redirect to home and then I get a blank page (actually the default.vue layout, no slot populated). For an example I have a product page with this code, were I try to handle if the product do not exist (url, ie params do not exist).

Script:

 <script setup>
 const { id } = useRoute().params;
 const runtimeConfig = useRuntimeConfig()
 const uri =`${runtimeConfig.public.apiUrl}/api/content/item/Products/${id}`
 const { data: product } = await useFetch(uri, {
 method: "GET",
 key: id,
 })
 if (!product.value) {
 throw createError({ statusCode: 404, statusMessage: "Procuct not found 
 (shop id)" })
 }
 </script>

Edit: Guess it is the sam problem as this topic: https://github.com/nuxt/nuxt/issues/15432

Answer 1

I had figure it out by my self. Removed the last line in the.htaccess file. Also had to do a fatal:true , on the createError (if not a blank page). The change in.htaccess removed the funny populating off error message last in document (after footer). For the record, This is config without app.vue (Nuxt default instead), and Nuxt 3.

It also functions with the function showError (seems faster).

So final.htaccess:

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
</IfModule>
ErrorDocument 404 /404.html

and error handling alternatives:

 throw createError({statusCode: 404, statusMessage: "Page 
 not found.", fatal:true})

ore:

 showError({statusCode: 404, statusMessage: "Page not 
 found."})

I am not an expert on Apache, but the.htaccess function with Nuxt in builded mode now, but if some one else have a comment, feel free to post!