To test APIs using Z-Ray:
- Create a Web page consuming your Web service.
The example below defines four buttons with a callback for each API method using the jQuery library.
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script> function addUser() { $.ajax({ "type": "post", "url": "http://<your-domain>/users", "data": { "username": "johnshow", "password": "j0hn$n0W", "fullname": "John Snow", "email": "john@snow.wf" }, "success": function(result) { console.log('result', result); }, "dataType": "json" }); } function updateUser() { $.ajax({ "type": "put", "url": "http://<your-domain>/users/johnshow", "data": { "email": "john.show@bstrd.from.wf" }, "success": function(result) { console.log('result', result); }, "dataType": "json" }); } function getUsers() { $.getJSON('http://<your-domain>/users', function(result) { console.log('result', result); }); } function deleteUser() { $.ajax({ "type": "delete", "url": "http://<your-domain>/users/johnshow", "success": function(result) { console.log('result', result); }, "dataType": "json" }); } </script> </head> <body> <button onclick="addUser()">Add new user</button> <button onclick="updateUser()">Update the user</button> <button onclick="getUsers()">List all users</button> <button onclick="deleteUser()">Delete the user</button> </body> </html>
- Place the Web page on your Web server, and open the page in a browser.
Z-Ray is displayed at the bottom of the page.
-
Click one of the buttons. A new request is added to the Z-ray Page Requests panel.
- Click the request.
Z-Ray displays all the information on the request.
|