Laravel Sanctum (Airlock) with Postman
Playing
01. Laravel Sanctum (Airlock) with Postman

Episodes

0%
Your progress
  • Total: 12m
  • Played: 0m
  • Remaining: 12m
Join or sign in to track your progress

Transcript

00:00
If you're building an API and you're using Laravel Sanctum for your authentication method, then using Postman is a little bit trickier than you might imagine to send requests. With normal token-based authentication, it's really simple to make authenticated requests. We just either add this to the query string or we add this inside of a bearer token inside
00:20
of our authorization tab. But working with Laravel Sanctum is different because we are working with cookie-based authentication. So what I'm going to show you in this snippet is how to basically get this set up within Postman so you can just really quickly get on and start sending requests through to your
00:38
API as an authenticated user. So I've got a sample application set up here ready to go, and I'm just going to go ahead and log in. You can see over in the body here I've got my email and password, so I'm going to send
00:49
that request through as normal. Now notice what we're not doing here is sending a request through to the cross-site request forgery cookie endpoint, which we have to do with Laravel Sanctum. But we are actually doing that in a pre-request script, so I'll show you how to do that in
01:04
just a second. Now once we have logged in, if we come over to the example endpoint that we have within Laravel already and send a request here, you can see I'm automatically authenticated. So how does this work?
01:17
Well, that's exactly what I'm going to show you in the snippet. So let's get started, and we'll do this all from scratch so you can completely follow along and get this working for yourself. Okay, so I'm currently working on a NUX forum course, so I think I'm going to use the API
01:33
for this just to test this out. So I'm going to come over to the API folder here, and I'm just going to do a PHP artisan serve. And because of that, I'm running this on 127.0.0.1.
01:46
So first thing I'm going to do is take this URL, come straight over to Postman, and let's try and send a request through to see what we get. So let's make a post request through to the login endpoint. So let's just go over to login.
01:58
And of course, over in the headers section, we're going to go ahead and add in the accept header, and we're going to set this to application JSON so Laravel knows how to respond properly with an API request. Otherwise, we're just going to get HTML.
02:11
So over in body, of course, we're going to choose form data, and we're going to go ahead and enter our email address and our password and just see what happens when we log in. So let's go over to here and enter our password, which for me is literally just the string password.
02:26
So what we get here is a cross-site request forgery token mismatch. That's obvious because we are enabling cross-site request forgery protection for our login endpoints. We disable them for our API endpoints, so we don't need them for all of our API endpoints unless you choose to add them.
02:42
But at least for login and logout and things like that and potentially register, you're going to want to keep them in. So with Laravel Sanctum, I assume you've worked with this already. What we need to do before we start to send requests through to the login endpoint, we
02:57
need to send a GET request to the Sanctum cross-site request forgery token endpoint, which will give us back a cookie containing the cross-site request forgery token that we need to get through to this endpoint. Now this can be done in the pre-request script just here, or what you can do is if you want
03:17
to send this request to grab the cookie back or the token back and set that in a cookie for every single request you make, the best thing to do is to add all of your application endpoints to a collection in Postman. And this is a good idea anyway because it helps you organize stuff out.
03:33
So let's go over to click New Collection. I'm just going to type Forum in here. And let's just save this out for now. And let's go and add this one or save this one at least over into that collection.
03:45
So let's save that into the Forum collection. And now what we can do with this particular collection is set a pre-request script for every single endpoint in this collection. So that's exactly what we're going to do.
03:59
And we're going to do this based on what is in the Sanctum documentation. But of course we're working with Postman here, so we need to write this code out a little differently. Normally what we would do is we would use Axios to go ahead and make a request to that
04:13
endpoint. But of course inside of Postman that may not be available. So we're going to use PM, which is the Postman instance. And we're going to go ahead and send a request over to that endpoint.
04:23
This just takes in an object. You can give the URL in here and you can give the method. And we know that the method is just get for this. And let's paste in the URL that we had from earlier.
04:33
And let's go ahead and make a request to Sanctum, cross site request forgery cookie. And what that will automatically do is give back the cookies that our client needs to set. Now of course in a browser that will be set because it is stateful and you'll have the
04:47
cookies saved in your browser ready to go. Postman does do this, but we need to do a little bit more work to kind of get around this. So as the second argument here we get a function, and what this will give back is an error if
04:59
there is one. It will give back the response if we do need to grab the response, which we don't. And what we can also do is destructure things that we get back from this request like cookies. So we're going to take the cookies that we get back from the request this end point and
05:14
we're going to set them inside of a Postman environment variable that we can then use to add to our headers. So the first thing I'm going to do, you can do pretty much anything in here, we're only just using this to request to our API so it doesn't really matter about what we write.
05:26
We're going to say well if we don't see an error, I'm going to go ahead and access the Postman environment and I'm going to go ahead and set an environment variable that we can then use. So I'm just going to call this cross-site request forgery cookie, and I'm going to set
05:41
the value of that to using them destructure cookies. That gives us back an object that we can use to grab values from, and the cookie that's actually sent back from Laravel is called cross-site request forgery token. So if we send this request across now and we open up our environment variables, we do
06:00
actually have that set. Now the moment it shows null, I've got a feeling that it's just because I have my session domain set to local host, so I'm going to go ahead and change that over there and let's also switch this over in our pre-request script as well.
06:16
So we just of course need to make sure that our cause and everything matches up with the correct domain. So let's send this across again and let's open this up and sure enough there we go. There is our cross-site request forgery token in there ready to be sent across.
06:31
Now it still doesn't work. The pre-request script obviously runs before we send this request. That gives us the ability now to actually send a manual header across. Now the header that Laravel accepts when it is determining whether a cross-site request
06:47
forgery token is valid is xxsiterequestforgery and I believe it's token. Let's just give it a try. Now inside of the value what we can do is we can take this variable name here and we can actually pop that inside of here.
07:03
So let's do that inside of double brackets and you can see you've got the current value of it there and let's send this across and see what happens. So you can see now this has actually worked. The request here is working and I actually believe I am logged in so you can actually
07:18
see the HTML that's being returned to us and that's fine because to make a request to this endpoint is just the normal web route so you would expect to get back some HTML. So now that we are technically authenticated if we head over to the cookie section in Postman you can see that we've got the Laravel session cookie being set which means that if we duplicate
07:39
this tab over and we go ahead and rename this to slash auth or slash API slash user I believe it is and change this over as well and we send a get request to this, this should work. So let's get rid of the cross site request forgery token header here because we don't actually need that and of course let's get rid of the body as well because we don't need
08:00
to send a body with this and we should be good. So let's send this request across but we still get unauthenticated. Now to demo out why this isn't working what I'm going to do is just open up my kernel so we can check the ensure front end requests are stateful middleware.
08:18
So let's open that up and let's take a look at what happens when this is run. So you can see here we get first of all configure secure cookie sessions. Let's come down to that and see if that gives us anything. Probably not so let's ignore that for now.
08:32
And then inside of here we've got a new pipeline and we see in here that this goes ahead and pipes this through static from front end so we should have a method in here called from front end. So what this is going to do is it's going to check the referrer.
08:50
You can see that we get request headers get referrer so that's the first one and then otherwise we go ahead and replace that with HTTP just in case. So what's actually missing here is a referrer. So if we come over to here and over to our headers and set the referrer header to localhost
09:10
8000 and send that request, sure enough that works. So the missing piece of this is the correct referrer. Now what you're going to have to do is for every request you make have this referrer in here.
09:24
You could set this up with a pre-request script to add this to your headers automatically but to be honest when you're creating a new endpoint in Postman it's not too much trouble to add this in. Now if you change domains that's going to be a bit of a problem so I'm going to actually
09:38
cut this out of here. I'm going to come over to my environment and I'm going to add in a just endpoint or let's call this host just to keep things really simple and set that to localhost 8000 and then what we can do is we can replace this out in here with the host and if we send that
09:56
across sure enough this works as we would expect. Okay let's take a quick look at logging out because that's going to be a little bit different. So let's go ahead and create out a new request here and send a post request through to logout. Now let's just send that as it is and of course we'd expect to get back an error.
10:14
We've got a page expired. We add our except in here in the headers not the params. What we should see is some JSON return so let's say application JSON on here and we get a cross site request for a tree token mismatch.
10:29
Now that's just because like the login page the logout page is a web route so we would expect to need a cross site request for a tree token. So what we need to do is add that as a header in here as well but for the rest of your API endpoints you won't need to send a cross site request for a tree token across.
10:47
Now I've just successfully sent a request to that. Let's just save that out in our collection first of all so let's make sure we save that into our collection so we get the benefit of that pre request script and let's go over to the API user endpoint and send a request to that and sure enough we get unauthenticated
11:03
so because we've logged out now that initial value for that cookie is no longer available. If I log it back in again sure enough it works. So once you get the setup like this as long as you have the referring for all of the API endpoints you want to send a request to that's pretty much all you need.
11:19
You just need to refer in there once you've logged in and everything will work as you would expect. So there we go. My explanation was a little bit long winded but I wanted to make sure this was perfectly
11:28
clear exactly what we were doing. Step one create a collection and add that pre request script just inside of here. Step two is to hit the login endpoint with the cross site request for tree token in there for any subsequent requests in step three you need to send the refer a header across
11:46
which we've saved out in a environment variable just over here and then of course for any other web routes you're also going to need that cross site request for tree token but lastly if you just sending normal API requests you'll just need the referrer because the cookies within postman will be automatically sent through to the requests for you.

Episode summary

In this video, we dive into how to use Laravel Sanctum (formerly Airlock) for authenticating your API requests, specifically how to get it working smoothly with Postman – which, out of the box, is a bit trickier than you might expect! Unlike typical token-based authentication, Sanctum is designed to be more cookie-based, making things like getting the CSRF token and maintaining sessions important.

We start by trying a standard login request in Postman and hitting that classic "CSRF token mismatch" error. This leads to explaining why you need to pre-fetch the CSRF cookie from Sanctum's endpoint before you can log in. We show you how to organize all your endpoints in a Postman Collection, and then use a pre-request script to programmatically retrieve that CSRF token and store it in an environment variable.

Once that’s set, we set up headers and demonstrate how to send the right CSRF token with your login and logout requests. We also find the sneaky bit you need to make authenticated requests work: setting the Referer header correctly, so Laravel knows your requests are stateful. We troubleshoot why your /api/user endpoint might still show "Unauthenticated" even after logging in and show how to set up Postman to handle this automatically via environment variables.

By the end you'll see how logging in and logging out work in Postman, how Laravel's CSRF and session cookies integrate with your API requests, and how to avoid all the usual gotchas. If you follow along step-by-step, you'll be able to play with your Sanctum-protected endpoints without any headaches. Perfect for testing and developing APIs with confident authentication!

Episode discussion

No comments, yet. Be the first!