During the development process, many times we need to replicate the backend API call for debugging purposes. This is also required to write the automation & performance tests with proper API configuration details to successfully get the response as expected. Manually recreating the request with the correct URI, headers, and cookies can be tedious, and time-consuming too. Fortunately, most modern browsers come with a simple utility bundled along to solve this issue.
Let's take an example API call for this. We will be using the below free fake API site to demonstrate this.
Open the above link in the Chrome browser
Open developer tools either via navigating to Chrome Options > More Tools > Developer Tools OR using the shortcut CTRL + SHIFT + I / CMD + OPTION + I (Mac)
Click on the Run Script button to invoke the below sample API and see the response in the developer tools under the Network tab
Take a look at the request details like - Request URL, headers, cookies, etc.
- Select the request and right-click to see the options menu, then choose Copy > Copy as cURL
Curl (short for "Client URL") is a command-line tool that enables data transfer over various network protocols.
If the chrome is opened in windows, there will be 2 options for cURL - one for BASH and another for CMD
- Now the entire request details are added to the clipboard, something like this
curl 'https://jsonplaceholder.typicode.com/todos/1' \ -H 'authority: jsonplaceholder.typicode.com' \ -H 'accept: */*' \ -H 'accept-language: en-US,en;q=0.9,te;q=0.8' \ -H 'cookie: _ga=GA1.1.63507224.1695719458; ajs_anonymous_id=c601a09a-3cc6-4b84-a482-f58a353eea86; _ga_E3C3GCQVBN=GS1.1.1695719418.104.22.1685720002.0.0.0' \ -H 'if-none-match: W/"53-hfEnumeNh6YirfjyjaujcOPPT+s"' \ -H 'referer: https://jsonplaceholder.typicode.com/' \ -H 'sec-ch-ua: "Chromium";v="116", "Not)A;Brand";v="24", "Google Chrome";v="116"' \ -H 'sec-ch-ua-mobile: ?0' \ -H 'sec-ch-ua-platform: "macOS"' \ -H 'sec-fetch-dest: empty' \ -H 'sec-fetch-mode: cors' \ -H 'sec-fetch-site: same-origin' \ -H 'user-agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/22.214.171.124 Safari/537.36' \ --compressed
Use in terminal
We can simply paste the copied content and hit the request in the terminal. As we see, the correct response is being shown.
Use in Postman
Postman has an import option to load the API requests. Let's use the below option to import the request and check the response.
- Open Postman, navigate to File > Import > Raw text option paste the text that we copied in the previous step, and click Continue and then Import
- Once the request is sent to the server, we see the same response.
We may ignore the response codes for this example - as the server responds with 304 in the browser due to internal redirection logic whereas it gives 200 in the postman for the same call.
Using the copied cURL command in Postman, we can effortlessly edit it according to our needs and begin utilizing the APIs immediately. Other browsers - Firefox, Edge, Safari, etc. also have similar features to get this info from the developer tools making developers' lives easy.
Thank you for reading!