F
Filament13mo ago
Arnaud

Use Notification for error 500 in production

Hello, With error handling, how do you manage to display a notification instead of the classical big gray screen for error 500 in production ? I just would like to say there is an error, contact the support. Best regards,
Solution:
Hello Dennis, in production I have APP_DEBUG=false, however I still have this big gray screen. So if somebody is interested, I found a solution. In resources/js/app.js Insert the following code :...
Jump to solution
3 Replies
Dennis Koch
Dennis Koch13mo ago
That "big gray screen" should only appear when APP_DEBUG is turned on, which should be disabled on production
Solution
Arnaud
Arnaud13mo ago
Hello Dennis, in production I have APP_DEBUG=false, however I still have this big gray screen. So if somebody is interested, I found a solution. In resources/js/app.js Insert the following code :
document.addEventListener('livewire:init', () => {
Livewire.hook('request', ({ fail }) => {
fail(({ status, preventDefault }) => {
if (status === 500 && !import.meta.env.VITE_APP_DEBUG) {
new FilamentNotification()
.title('Error')
.danger()
.body('Support team received an error notification. We will contact you as soon as possible.')
.send()

preventDefault()
}
})
})
})
document.addEventListener('livewire:init', () => {
Livewire.hook('request', ({ fail }) => {
fail(({ status, preventDefault }) => {
if (status === 500 && !import.meta.env.VITE_APP_DEBUG) {
new FilamentNotification()
.title('Error')
.danger()
.body('Support team received an error notification. We will contact you as soon as possible.')
.send()

preventDefault()
}
})
})
})
And in .env :
VITE_APP_DEBUG=true
VITE_APP_DEBUG=true
With vite app debug, you can still display regular message in your dev env but use the notification in your prod env. You can customize every error message. For my case it's nice, so I receive on Flare the error but user is not bother.
qcol
qcol8mo ago
Hi! Also, I am looking for a solution so that the customer receives a simple notification instead of the "ERROR 500" screen. Unfortunately this solution does not work for me. I pasted the code into app.js, in the .env I have APP_DEBUG=1 VITE_APP_DEBUG=true What other conditions need to be met for this to work?

Did you find this page helpful?