Example: Security type - OAUTH2

In this example, We will create a custom by using Typeform - API Docs.

Steps

Create a Connector
Configure Connectivity
Create an Operation

Create a Connector

Navigate to, Left panel --> More --> My Apps
Click Cerate a new connector
In the Modal, fill out the following elements, then click Save

Title - Typeform
Description - Create is a RESTful API that gives you direct control over your typeforms, images, and themes, plus more customization options to make your typeforms even more engaging.
Image URL - https://easyflow-assets.s3-us-west-2.amazonaws.com/stencils/APP_TYPEFORM_128x128.svg
Host URL - api.typeform.com
Security Type - oauth2
Active - true

Configure Connectivity

Navigate to, Left panel --> More --> My Apps
Click on Clockify connector
In the Manage modal options, Click Configure Connectivity
Modify the fields and click Save

parameters [ ] - Contains a set of keys to be used in urls [ ] and data [ ].
data [ ] - Contains a set of keys. to be used in urls [ ]
urls [ ] - Requires the following keys for connection process: authorisation, authentication & refresh_token

authorisation - Contains query parameters. Read values from parameters [ ]. Example: client_id={params.client_id}
authentication - Contains body parameters. Read values from data [ ]
refresh_token - Contains body parameters. Read values from data [ ]
settings [ ] - Based on Typeform API Docs, the refresh_token expires after first use. In this case, the expected response of the refresh_token type endpoint will return a new “refresh_token” key. For this reason the following key should be used and set to true: UPDATE_REFRESH_TOKEN_FROM_CONNECTION

Obtain Identifier value

This value will replace YOUR_CUSTOM_CONNECTOR_ID under parameters [ ] --> redirect_uri

{
  "parameters": [
    {
      "name": "redirect_uri", 
      "value": "?identifier=YOUR_CUSTOM_CONNECTOR_ID"
    }
  ]
}

Steps
Navigate to, Left panel --> More --> My Apps
Click on the connector
In the Manage modal options, Click Connector Information
In the Connector Information modal, copy the Identifier value.

Code Snippet

{ 
  "annotation": [
    {
      "key": "note_general",
      "value": "Create is a RESTful API that gives you direct control over your typeforms, images, and themes, plus more customization options to make your typeforms even more engaging."
    }
  ],
  "items": [],
  "urls": [
    {
      "name": "authorisation",
      "value": "https://api.typeform.com/oauth/authorize?scope={params.scope}&redirect_uri={params.redirect_uri}&response_type={params.code}&client_id={params.client_id}"
    },
    {
      "name": "authentication",
      "value": "https://api.typeform.com/oauth/token"
    },
    {
      "name": "refresh_token",
      "value": "https://api.typeform.com/oauth/token"
    }  
  ],
  "parameters": [
    {
      "name": "response_type",
      "value": "code"
    },
    {
      "name": "redirect_uri",
      "value": "?identifier=YOUR_CUSTOM_CONNECTOR_ID"
    },
    {
      "name": "client_id",
      "value": "YOUR_3RD-PARTY-APP_CLIENT_ID"
    },
    {
      "name": "client_secret",
      "value": "YOUR_3RD-PARTY-APP_CLIENT_SECRET"
    },
    {
      "name": "scope",
      "value": "offline+accounts:read+forms:write+forms:read+images:write+images:read+themes:write+themes:read+responses:write+responses:read+webhooks:write+webhooks:read+workspaces:write+workspaces:read"
    }  
  ],
  "headers": [],
  "data": [
    {
      "type": "authentication",
      "name": "client_id",
      "value": "{params.client_id}"
    },
    {
      "type": "authentication",
      "name": "client_secret",
      "value": "{params.client_secret}"
    },
    {
      "type": "authentication",
      "name": "redirect_uri",
      "value": "{params.redirect_uri}"
    },
    {
      "type": "authentication",
      "name": "grant_type",
      "value": "authorization_code"
    },
    {
      "type": "authentication",
      "name": "code",
      "value": "{query.code}"
    },
    {
      "type": "refresh_token",
      "name": "client_id",
      "value": "{params.client_id}"
    },
    {
      "type": "refresh_token",
      "name": "client_secret",
      "value": "{params.client_secret}"
    },
    {
      "type": "refresh_token",
      "name": "redirect_uri",
      "value": "{params.redirect_uri}"
    },
    {
      "type": "refresh_token",
      "name": "grant_type",
      "value": "refresh_token"
    },
    {
      "type": "refresh_token",
      "name": "refresh_token",
      "value": "{connection.refresh_token}"
    }  
  ],
  "settings": [
    {
      "name": "UPDATE_REFRESH_TOKEN_FROM_CONNECTION",
      "value": "true"
    }  
  ]
}

Create an Operation

Navigate to, Left panel --> More --> My Apps
Click the connector to be modified
In the Manage modal options, Click Create an Operation (API Endpoint)
In the Modal, modify the fields and click Save

Title - Retrieve form
Description - Retrieves a form by the given form ID.
Method - GET
Path - /forms/{form_id}
Popular - true
Parameters - JSON editor to add the endpoint parameters

[
  {
    "description": "",
    "in": "header",
    "name": "Content-Type",
    "required": true,
    "type": "string",
    "default": "application/json",
    "isHidden": true
  },
  {
    "description": "",
    "in": "header",
    "name": "Accept",
    "required": true,
    "type": "string",
    "default": "application/json",
    "isHidden": true
  },
  {
    "label": "Form ID",
    "description": "Unique ID for the form.",
    "in": "path",
    "name": "form_id",
    "type": "string",
    "required": true,
    "default": "YOUR_FORM_ID"
  }
]

Updated on: 15/11/2022