Day 4

Sessions Table doesn’t exist

I was getting an error about the sessions table not existing. I fixed it by running the migrations.

sail artisan migrate

419 Page Expired

Laravel is now returning the cookie with the call to /sanctum/csrf-cookie. However, I get a 419 Page Expired error immediately after when calling /register.

Possibilities investigated:

• The call is sending the Set-Cookie header to the server.
• I was calling the CSRF endpoint twice (once in a console.log) and once for real. I wondered if that was the problem, but nothing changed once I updated it to only call once.
• According to docs for Sanctum, “[i]f your JavaScript HTTP library does not set the value for you, you will need to manually set the X-XSRF-TOKEN header to match the URL decoded value of the XSRF-TOKEN cookie that is set by this route.”
  • I am going to try to get the cookie and set the header manually.
  • First, I need to figure out how to get the cookie values from the fetch response.
  • Scratch that. I’m just going to use Axios. I didn’t want to bring in such a big dependency, but I cannot recreate Axios’s feature where it can get the cookie from one request response and set it as a header in the next request.
    • It seems like there should be a way to do that in native JS if Axios can do it. Maybe I’ll do some further research later.

Axios

Once I added Axios, the XSRF token was being sent correctly. I think withXSRFToken is the key to that.

import Axios from 'axios';

const axios = Axios.create({
	baseURL: import.meta.env.VITE_API_URL,
	headers: {
		'X-Requested-With': 'XMLHttpRequest',
	},
	withCredentials: true,
	withXSRFToken: true,
});

export default axios;

Next Steps

The data I’m sending from the pre-existing frontend is different than what the default Laravel auth endpoint expects. The endpoint responds with a 422 code. Time to update it.