Are you developing an Ajax based application or placing some Ajax mechanism in your web pages? And you do not know how to verify the request and response of these Ajax calls.
Well! We shall look into Browser Developer Mode and see the Ajax Request and Response.
Open Chrome Browser and hit the URL of your website that has Ajax calls.
Now Open Developer Tools.
Options (Customize and control Google Chrome) -> More Tools -> Developer Tools.
There will be many tabs. But we use ‘Network’ tab for testing Ajax Calls.
Perform an action that triggers an Ajax Call.
For demonstration, we used Submit Quiz Question to TutorialKart. When you fill in the details and click on Submit, an Ajax Call is sent.
How to check the Ajax Request and Response
In the above picture, you see that there is a new entry in the Network Tab with the name admin-ajax.php.
Click on the entry.
Headers Tab
In the headers tab, you have the following sections.
- General
- Response Headers
- Request Headers
- Form Data
In General section, you see the details like Request URL, Request Method (GET/POST), Status Code (if 200, then its a success), Remote IP Address.
Form Data
If you have done the Ajax Call on a form and sent the serialized form data, you can see the fields sent in the Ajax Call under Form Data section.
Any response from the Ajax Call can be seen under Response Tab.
