Using the Browser Console to view API calls in 20i API

Josh Sargent
Published: 31 July 2024Last updated: 18 September 2024
Share:

The 20i Reseller API is a powerful tool that will allow you to take advantage of all the features and functionality of StackCP, allowing for the creation of your own customised hosting control panel from the ground up or the possibility to seamlessly integrate external services to build upon your existing systems. Making use of the API can also make the management of your Reseller hosting more efficient by allowing you to automate repetitive tasks

We do provide in-depth API documentation. You can access the API documentation directly from your account by navigating to Manage Reseller > API > View Documentation.

Our documentation covers the functions which we deem the most critical and those most commonly used to allow you to manage your Reseller hosting. However, there are certain functions and use cases, where the API documentation will not provide all the information you require. In these cases it is possible to reverse engineer these API calls to be able to implement these yourself. 

Making use of the browser console to view API Calls.

Almost every action on our platform has an associated API call, and whilst our documentation does not cover all of these you can figure out these API calls yourself using the browser console. 

On Windows, you can access the browser console by pressing F12, and we are specifically looking for the Network tab. This tab will record all requests and their responses that happen while it is open. We can use the information in the Network tab to figure out the API endpoint, as well as the payload used in certain actions. Let us take adding an email forwarder as an example. If you navigate to a package, and go to the Email Forwarder section. With the Network tab open, if you then add a forwarder, you should see a response appear that is titled yourdomain.com. If you click on this request you should see then see the Headers of the request.

forwarderAPI-1.PNG

From the headers section, you will want to make note of the Request URL as part of this will be used as the endpoint. This example, it is specifically the package/2706442/email/20itesting.com section. To get the full API Endpoint, you will want to add that section to the URL https://api.20i.com/. You can use this to get a general endpoint which would be something along the lines of https://api.20i.com/package/$packageID/email/$domainName.

Now that we have the endpoint for a given request, we need to retrieve the payload. If you click on the Payload tab, just next to the header one you will see something similar to the following.

forwarderAPI-2.PNG

In this case, the raw payload is: {"new":{"forward":{"local":"enquirues","remote":"testing@20i.com"}}}

From this, we can get a general payload of {"new":{"forward":{"local":"$mailboxToForward","remote":"$destinationAddress"}}}. Another common way of writing this would be:

["new" => 
	["forward" =>
		["local" => "$mailboxToForward",
		 "remote" => "$destinationAddress"
		]		
	]
]

The process of retrieving the API end-point and payload is the same across the board and you can use it to figure out the API calls for those actions and functions that are not covered in our API documentation.