Connect to a simple web API

If connecting your application using Zapier is not an option, or you simply want more control over the connection, you can use Triggre Webhook functionality to connect your Triggre application to a webhook or web API.

In this lesson you’ll learn how this functionality works.

Application to connect to

In this example we will connect to the cat fact API. It is a simple API that returns an interesting fact about cats, plus the number of characters of that fact. This is what the result looks like:
Cat fact API

For most APIs there is extensive documentation, which we highly recommend you read and keep handy while connecting to it. It will tell you the type of authentication used, the type of request to use and the Inputs and Outputs that the API uses.

Connecting to the API

We start by creating a new Flow part. Open the Flow part and then go through the following steps.

  1. Start adding an Action after the start of the Flow part by going into Add mode and clicking the Add button:
    Add button

  2. Select Connection and click Next:
    Connection

  3. As Type of connection, select Web API:
    Web API

  4. As the URL for the webhook, use https://catfact.ninja/fact and select GET as the request type:
    URL

  5. Use No authentication, since this API doesn’t need any authentication:
    No authentication

  6. Skip the Additional query parameters, Additional headers and Cookie values steps.

  7. Then select Yes, as JSON as the webhook Return data:
    Return data

  8. Now you will have to define the data that the API returns. Start by clicking the blue Add button to go into Add mode:
    Blue add button

  9. Once in Add mode, we click the green Add button:
    Green add button

  10. Now we select whether the API returns a List (also called array) of items, or, as in this case, a single Custom item:
    Add data
    Most APIs return a Custom item, with the data inside the item. You can see this because the data starts with { and ends with }. Triggre will make a visual representation, resembling the way most examples in API documentation look, so it will be easier for you to see whether you’ve correctly designed your Action.

  11. With the Custom item added, we click the green Add button again, to add a value to the Return data:
    Green add button

  12. Next, select Specific type, then Texts and finally Any text.

  13. Give the value the correct name, corresponding to the Return value of the API. In this case, use Fact. You will now see the value in the Return data:
    Return data

  14. Add another Return value, of type Number, of type Integer (a whole number, without decimals):
    Integer

  15. Name this Return value length. Your Return data should now look like this:
    Return data

  16. Exit Add mode by clicking the blue Add button:
    Blue add button

  17. Name your Action Get cat fact and click Done. Your Flow part should now look like this:
    Flow part

  18. Click the green Add button and end the Flow part. You should end up with your Flow part looking like this:
    End the flow part

  19. Select the End point to add an Output:
    Output

  20. You can now select the Return values from the API Action that you have defined. Select Fact under Response / Data / Response body:

  • Content type will give you a text that defines the type of data that was sent back. This can be application/json as it is in our case, or something else. Check the documentation of the webhook or web API you are calling to see what it can be.
  • Status Code is the numeric value that indicates whether the request was successful. 200 indicates success. For other values check the documentation of the webhook or web API you are calling, as this differs for each.
  1. After adding Fact as an Output, add the Return value Length as well. Your Flow part should now look like this:

  2. Exit Add mode and give your Flow part a name, for example Get a cat fact. Your Flow part is now ready to use anywhere in your application!