/ I get redirected to /login as expected.I tried myriad ways to force the XSRF token to be included, like including the hidden input fields on forms, messing with middleware and various config settings. It wasn't until recently that I noticed the earlier requests (before the form submission) actually do include the tokens already. Inertia supposedly handles this automatically.
Now I've been trying to come up with more ways to get to the bottom of this. Here's the request, for completeness I suppose:
POST /login HTTP/3
Host: inertia-react-162956230927.asia-northeast2.run.app
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:130.0) Gecko/20100101 Firefox/130.0
Accept: text/html, application/xhtml+xml
Accept-Language: en-US,en;q=0.5
Accept-Encoding: gzip, deflate, br, zstd
Content-Type: application/json
Content-Length: 70
X-Requested-With: XMLHttpRequest
X-Inertia: true
X-Inertia-Version: ba6fd3500ad1fa8ab5152eef0ed1845b
Origin: https://inertia-react-162956230927.asia-northeast2.run.app
Connection: keep-alive
Sec-Fetch-Dest: empty
Sec-Fetch-Mode: cors
Sec-Fetch-Site: same-origin
As you can see there is no X-XSRF token, even though it should be expected to be there.
On the earlier GET requests to the login page, this was part of the response:
XSRF-TOKEN=eyJpdiI(...)iIn0%3D; expires=Wed, 02 Oct 2024 04:24:58 GMT; Max-Age=7200; path=/; domain=inertia-react-162956230927.asia-northeast2.run.app; samesite=lax
I truncated the token itself. I guess if you want to, you can visit the domain from the GET request yourself and see what's up. For now I'm hoping that someone could point out either A: something I'm apparently misunderstanding here or B: other ways to analyze and isolate the problem, or C: wrap my head around this to understand what's going on.
PS: The project itself is mostly the same as from this tutorial https://youtu.be/VrQRa-afCAk?si=BX23_FzKshzscERW and is to be remodeled when deployment issues are figured out. Not that I'm expecting anyone to watch the 5h video, but perhaps someone is familiar with the setup...
Well, after nearly despairing and trying everything that worked for others and remotely resembled my problem, I stumbled upon a solution by chance.
In resources/js/bootstrap.js I added these two lines:
window.axios.defaults.withCredentials = true;
window.axios.defaults.withXSRFToken = true;
Even though examining the Network requests in the browser, the XSRF token now seemed to be present, perhaps it was nevertheless not getting transmitted correctly, or something was wrong with it.
Here's where I found the solution that worked for me: https://laracasts.com/discuss/channels/inertia/laravel-10-inertia-error-419-on-production
The user JussiManisto also offered a possible explanation in there, which I'm going to quote here.
Axios received a CVE in October regarding the withCredentials option. As a result the behavior of the option was changed so that it no longer automatically adds the XSRF header to cross-origin requests. They later added the withXSRFToken option to mimic the old behavior.
Do note that adding withXSRFToken adds the token to all requests. This is what the CVE was about. So use different Axios settings if you're sending requests to 3rd party APIs and don't want to leak your XSRF token.