Using Z-Ray to Test APIs

This topics explains how to use Z-Ray to test web services.

To use the example in this topic, create a simple user management RESTful service.

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.

If Z-Ray is not displayed, make sure it is enabled. For more information on enabling Z-Ray, see Enabling/Disabling Z-Ray.