Better Explanation, Examples & UI Improvements for HTTP Request Block

As a chatbot developer using Chatling, I’ve found the HTTP Request block to be powerful but quite difficult to understand in depth — especially when dealing with complex setups like headers, query parameters, dynamic path variables, or mapping JSON responses.

Currently, the block includes options like:

• Request method (GET, POST, PUT, PATCH, DELETE)

• Endpoint URL

• Request options (headers, query parameters, body)

• Capture Response to a variable (JSON required)

However, these features are not explained clearly within the platform, and there are no detailed examples or visual guidance, which makes it hard for new users to implement API integrations correctly.

💡 Suggested Improvements:

1. Add Detailed In-UI Explanations for Each Field

• Tooltips or small info icons (ℹ️) next to each field with simple explanations.

• For example:

  • Headers: “Used for passing authentication tokens or content-type info (e.g., Authorization: Bearer your_token)”

  • Request Body: “Only used in POST/PUT/PATCH. Must be valid JSON. You can include variables using {{variable_name}}”

2. Provide Real-World API Examples

• Include sample configurations (preset templates) such as:

  • “Get product by ID”

  • “Submit a contact form”

  • “Authenticate with a token”

• These examples should pre-fill the HTTP Request block to show how each part connects.

3. Add Preview/Test Functionality

• Let users test the API call directly from within the block.

• Show the raw request and raw response (status code, headers, response body) to help with debugging.

4. Better Response Mapping Interface

• After capturing a JSON response, show a visual tree viewer of the response with easy ways to bind values like {{response.product.name}}.

• Add a response validator or sample preview.