(Update: Please see my response below. I set this project up to try and isolate a 419 issue with another project. Initially I had some different problems with this barebones project, but have since found a way around them. So now I need help with the 419 issue that bunch of people seem to experience, but none of the solutions that have worked for others were successfull for me.)
By default I mean there are no changes made to the code or config files of the project itself.
I'm trying to smooth out some trouble I have with the deployment of another project, by first finding a clean and working deployment configuration with a plain project, i.e. only the Breeze login/auth features.
Here's the public repository on GitHub: https://github.com/larshappel/csrf-debug
I included the .env for documentation purposes, as there's no sensitive content inside.
As the Readme states, this is how the project was created:
composer create-project laravel/laravel csrf-debug
# -> Installing laravel/laravel (v11.2.0)
cd csrf-debug
composer require laravel-breeze --dev
php artisan breeze:install
# -> Select React from the install menu
npm run build # Create JS files
Afterwards, I put in some config files for setting up Docker and nginx:
- Dockerfile
- docker-compose.yml
- startup.sh
- nginx.conf
You can see the contents of all of these files in the repository. I'm not very experienced with setting these up, so maybe they contain some issues, and I would be happy if anyone could point anything out.
The app is deployed on GCP Cloud Run here:
https://csrf-debug-162956230927.asia-northeast2.run.app/
When you visit, you might first get a 502 Bad Gateway, when the container takes a moment to start up.
What I'm wondering about is, when visiting the site I sometimes get the "Minified React Error 321" (https://react.dev/errors/321?invariant=321) which suggests there's something wrong with a hook call, or mismatching or double versions of React...? I have no idea, but this doesn't happen when I run the image locally.
Sometimes upon revisiting the site, it apparently loads correctly, giving only a "TypeError: Re.current is null" in the console.
Then, when clicking for example "Register" in the top right, a modal shows this:
All Inertia requests must receive a valid Inertia response, however a plain JSON response was received.
{"component":"Auth/Register","props":{"errors":{},"auth":{"user":null}},"url":"/register","version":"b9ecb29065f8ae28af4812f3e5ad49c5"}
Again, this isn't something that happened when running the container locally, and of course all the Inertia middleware should be in place.
I can hardly believe the default setup after project initialization would contain any bugs, so I'm sure the issue has to be with my configuration of the container...?
I would be super happy if someone could help me out, as I've been trying for several days now to get a Laravel-Inertia-React app deployed in a production-like environment, but have been running into strange issues like this. (The main project has similar issues. It works locally, but after deploying the POST requests are missing XSRF tokens, so I'm getting 419 errors. However, that's a different can of worms. Here I'm trying to first isolate the issue by deploying a barebones project.)
I'm being verbose here, but I set up the public repo and documented the steps to make everything as transparent as possible, in hope someone can figure out what's going on.
