hello! Thanks for awesome video. Previously on laravel sanctum + nuxt 3 auth video we created a useApiFetch composable as a wrapper for usual useFetch. But sometimes we need to use an usual $fetch . How to attach all needed headers , credentials:'include' ans so on using $fetch?
Hey man btw, some useful information is that in the latest version of axios, withCredentials is not enough, you also have to add withXSRFToken and set it to true, this was because there was some kind of cve that allowed leakage of csrf tokens while using withCredentials, so they added the new property around two months ago
Ah yes! In the past the header was included automatically 🙈 Sometimes you might **not** want to do that - for example when using axios to talk to third-parties (they end up getting your token). In the video somewhere bellow the /sanctum/csrf-cookie request, I'm setting the x-xsrf-token header manually - which is what "withXSRFToken:true" does under the hood. Didn't know about the option though, thanks!
@@cdruc yeah I didn't know that too, I was creating a new app and setting everything correctly but I was still getting the 419 response, and after long hours of stress I found out about that change within axios lol
what'd be great is if you can make a starter-kit for react (or vue) with laravel breeze api - so we can just use that instead of having to do all this every time :P
hello! Thanks for awesome video. Previously on laravel sanctum + nuxt 3 auth video we created a useApiFetch composable as a wrapper for usual useFetch. But sometimes we need to use an usual $fetch . How to attach all needed headers , credentials:'include' ans so on using $fetch?
Hey man btw, some useful information is that in the latest version of axios, withCredentials is not enough, you also have to add withXSRFToken and set it to true, this was because there was some kind of cve that allowed leakage of csrf tokens while using withCredentials, so they added the new property around two months ago
Ah yes! In the past the header was included automatically 🙈
Sometimes you might **not** want to do that - for example when using axios to talk to third-parties (they end up getting your token).
In the video somewhere bellow the /sanctum/csrf-cookie request, I'm setting the x-xsrf-token header manually - which is what "withXSRFToken:true" does under the hood.
Didn't know about the option though, thanks!
@@cdruc yeah I didn't know that too, I was creating a new app and setting everything correctly but I was still getting the 419 response, and after long hours of stress I found out about that change within axios lol
@@thedavistheory7674 I went through the same thing and was like "what the hell am I doing wrong?? I swear this used to work" 🤣🤣
I'm experiencing a loop when attempting to implement this Axios interceptor. I'm unsure why, as it appears identical.
Can you show us how you protect your front-end routes?
yes, protect against what?
@@cdruc like how you redirect the user to the login page if there's no csrf cookie or you get a 401 response
You can create a pinia store and set a watch on a variable let's say authenticated, if watch value if false push login route.
wonderfull !!! you're the best !! :)
Awesome tuto ❤
I have a question:
How we switch between account in admin dashboard like platform Google, Microsoft, ect
what'd be great is if you can make a starter-kit for react (or vue) with laravel breeze api - so we can just use that instead of having to do all this every time :P