Hello everyone. I have multiple sites deployed via Laravel Forge. I'm using VILT stack, inertia SSR. I randomly getting this same error on multiple sites that SSR is working as intended;
TypeError: Cannot read properties of undefined (reading 'location')
at setup (file:///home/forge/bilsemonline.com/bootstrap/ssr/ssr.mjs:1795:44)
at file:///home/forge/bilsemonline.com/node_modules/@inertiajs/vue3/dist/index.esm.js:1:5890
at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
at async j (file:///home/forge/bilsemonline.com/node_modules/@inertiajs/vue3/dist/index.esm.js:1:5861)
at async Server.<anonymous> (file:///home/forge/bilsemonline.com/node_modules/@inertiajs/core/dist/server.esm.js:1:527)
Error refers to a line on ssr.js file
.use(ZiggyVue, {
...page.props.ziggy,
location: new URL(page.props.ziggy.location),
})
I'm searching the reason since a long time but couldn't find anything. What can be reason of error?
Try to use page.props.ziggy.url instead of .location
location: new URL(page.props.ziggy.url),
I've seen others having similar issues.
You can also try to log the page props before assigning the location. This way you can check if it contains the property url or location for ziggy.
@Bencute, is there any difference between the original version and this one? The original version is written using a normal function with passing "$request", and there are array_merge instead of spread operator.
I tried the solution suggested in the first comment, but the problem is not solved yet. There are three different servers on Forge. Two of them host multiple sites, while the other one has a single site. I keep encountering the same problem on all three servers. The servers' RAM usage is going crazy, and I suspect this issue is the cause.
And this problem occurs completely randomly, because such an error does not appear in my logs in the tests I made after deployment or locally, but after a while, I start to see this error in the logs for an unknown reason.
After months, I discovered something strange completely at random, and I experience this issue only on error pages (e.g., 404, 500).
The reason is that I'm using inertia render in the Exceptions/Handler.php file to showing users a proper error page written with vue. Somehow, Inertia cannot access the props in the HandleInertiaRequests section when there is an exception in prod(or debug is closed). Therefore, it also cannot access the request->url() that we are passing with Ziggy. Currently, I tried sending these props to both the HandleInertiaRequests share method and the inertia render within Exception/Handler using a static method. For now, I haven't observed any problems. I will inform you here if my issue is completely resolved.
@Aenzenith From experimentation, it seems this is because the web middleware group isn't applied to the rendered exception in bootstrap/app.php (which includes the HandleInertiaRequests middleware). A simple workaround for 404 errors is to do this in your routes/web.php file:
Intuitively, I would expect the middleware to be applied correctly to other error status codes, as these errors would logically have been thrown in a route already. I haven't confirmed this though.