JSON API

The JSON API Node is used to send or receive data from external service using REST API and optionally create dynamic nodes based on some logic written in JavaScript, which uses the response of the API.

To create a JSON API node add the node and following the steps below.

1. Select appropriate Req Type. Currently GET, POST, PUT, PATCH, and DELETE are supported.

2. Enter the URL of API. URL can contain dynamic parameters such as {{name}}, {{email}} etc and the system would replace these with actual values for each user. Please check templatization for more details on available variables.

3. For POST, PUT, PATCH, and DELETE requests, please enter the body of the request. The body can also contain dynamic parameters similar to the above point.

4. You need to write the body of a function that takes user and response(res) as parameters and returns a list of nodes. Below is the format of the function. Currently, only JSON response is supported. res will be the parsed JSON object.

   Copy

   function(user, res) {//res is json object returned by API
       //your logic goes here
       return {
           nodes:[]
       };
   }

   You only need to write the body of the function. This function is similar to the one in Dynamic node, except that the function receives the response from the API as an extra parameter res

Examples

1. Fetching data from server to show carousel dynamically

In this example we will be asking whether she wants to see the demos or guide for the chatbot, then get the relevant videos from API and show them in the chatbot in the form of carousal.

Demo API: https://raw.githubusercontent.com/Quick-Reply/test-data/master/demo.json

Video guide API: https://raw.githubusercontent.com/Quick-Reply/test-data/master/guide.json

Please note that the above urls are case-sensitive.

Steps to configure the

• Create a new blank playbook and Create a "Quick Reply" Node, and click on edit icon. (Please don't create "Quick Reply(with branches)" for this example).

• In the text message area write: "What would you like to watch?". Click each option to expand it edit the names of each. Make first option as "guide", and second one as "demo"

• Next we are going to save the option selected by user as a profile field. For that click on "Add action on Response", select Action as "Save as Profile Attribute" from the dropdown(can be found towards the end of dropdown), and in the Attribute text box enter video_type. Save everything.

• Next "Quick Reply", add "Json API" Node. Enter any name such as "Get Videos", Req type would be GET, Req URL would be https://raw.githubusercontent.com/Quick-Reply/test-data/master/{{profile.video_type}}.json. Please note that user option selected by user will be saved into video_type, and same is used in the URL. Enter the code given below in the Res function.

var cardNode = {
  "node_type": "CAROUSEL",
  "elements": []
};
for(var i=0;i<res.length;i++) {
    cardNode.elements.push({
        title: res[i].name,
        subtitle: res[i].description,
        image_url: res[i].image,
        buttons: [{
            link_type: "LINK",
          open_in_new_tab: true,
          title: "View video",
          url: res[i].link
        }]
    });
}
return {
    nodes:[cardNode]
};

Now you can test the playbook. and it would work as expected.