Mr_SC
Posted on February 25, 2021
In this post we are going to explain step by step how to use the Rest client visual studio code extension with Laravel.
What is REST client
Rest client is a Visual Studio code extension that enable the user to trigger HTTP request directly from your IDE.
The extension can be found in the Visual Studio code marketplace (https://marketplace.visualstudio.com/items?itemName=humao.rest-client) or by searching for it within VS code.
If you have ever used tools like Postman before, this is going to achieve a very similar result, with some added feature, that have convinced me to drop postman and start to use it in all my projects.
Pros on using REST client Vs Postman
- It is free to use and has no string attached
- The HTTP collection/files can easily be added as part of your source code and therefore are easy to share
- The HTTP are written in code, make them simpler to understand (as we are developers)
- The HTTP files are written, modified and run directly form your IDE
How to use it (the basic)
The homepage of the extension does a very good job at explaining in a few words how to make this extension work.
The steps are very easy:
- Install the extension
- Create a file with extension .http or .rest
- Write a valid endpoint (https://zelig880.com)
- click the “send request” button that appears on the request
That is all it needs.. as you can see, it is simple and powerful!
How to use it with authentication
Like with every hello word example, the real life is a bit more complicated and cruel.
The above example will work perfectly for all GET request that are open to the public and do not require any sort of authentication. But as we know that is not always the case.
In the following example I am going to cover the steps necessary to authenticate and use the authenticated token for request in a Laravel environment.
It is important to bear in mind, that the following example should work with most API that explicit a Bearer token authentication.
Our steps
The steps necessary to successfully send a POST request with token are:
- Write a POST request to the Login page with username and password
- Give a name on that request
- Link the response of the Auth request to any other request that require the token
The actual code
In our first step we are going to create a request to the login controller of our Laravel app. In this example I am using a test username and password (the one used in the application seeder), but if needed, you can set this value as environment variables as displayed in the extension documentation.
POST https://localhost:3000/login
content-type: application/json
{
"email": "test2@test.com",
"password": "password"
}
In the above file we are introducing a couple of new aspect. Let’s cover them all to rovide a better understanding of the tool:
POST https://localhost:3000/login
In this line we are setting the URL that it is going to be using in the request, but this time we are also specifying the request type (in this case POST).
content-type: application/json
Next we define a request header. The extension allows you to enter all valid request header for your request, but in our case we just need to define the content type to be able to send the POST information.
{
"email": "test2@test.com",
"password": "password"
}
Last but not least, we are able to define the information that we want to send over the wire.
Sending this request will result (in case in which the username and password are actually correct), in a successful returning a code 200.
In our next step we are going to learn how to “save” the token returned within the above request, and easily use it in subsequent request.
Before we move on, we are going to make two changes to our request. We are first going to give it a name, using the syntax # @name auth
, and then we are going to define a file environment to easily be able to manage my files
@baseUrl = http://localhost:3000
@email= test2@test.com
@password = password
# @name auth
POST {{baseUrl}}/login HTTP/1.1
content-type: application/json;charset=UTF-8
{
"email": "{{email}}",
"password": "{{password}}"
}
It is now time to create a new request, this time taking full advantage of out “auth” request token.
A single HTTP file can have multiple request. I personally create one for each major endpoint of my API. To divide 2 request you just need to add ###
...previous request
###
GET {{baseUrl}}/secure/endpoint
Authorization: Bearer {{auth.response.body.token}}
The example above is requesting content from a secure endpoint that requires out bearer token to fully function.
As previously mentioned, we had named out first request with the name of auth. Doing so will allow us to just access the response of that request like a normal variable as shown here:
Authorization: Bearer {{auth.response.body.token}}
Conclusion
You are now able to create many HTTP file, and fully document your API. If you have any comment, or feedback to improve this article, please do not esitate to comment below.
Posted on February 25, 2021
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.