Configuring REST API connectors- Multistep authentication

Studio provides you with several Connectors like Databases like MySQL, Microsoft SQL, etc., and Third-party connectors like Slack, Trello, Stripe, etc. You can connect the different APIs using their respective authentication methods. There are different methods of API authentication, using the API Key, using basic Auth which is using the username and password, using the OAuth which is a standard for accessing user permissions without a password, the AWS authentication method, and the multistep authentication method.

Multistep Authentication method is a nested or custom authentication. With multistep authentication, the user can provide two or more forms of authentication. A multistep authentication scheme considers using different resources of the same authentication factor to allow a user to access systems or information.

Configuring the third-party API connector

To add third-party connectors, under Studio > Connectors, click (+) Connector.

Studio has different options including the use of the REST API and GraphQL that allows you to easily connect to the Third-Party API and database and access important systems. Both of them have a multistep authentication feature. We will be selecting the REST API for this example.

Configure API Category

When configuring the APIs you need to provide the Authentication details for the respective authentication method. Let us see how to configure an API using the multistep authentication method.
Once you select the REST API, enter the Connector name which should ideally be self-explanatory.
In the Authentication, section select Multistep Authentication.

NOTE: Use the Multistep authentication type if your API supports Hybrid authentication. where you can chain together multiple “steps” to support virtually any kind of API authentication.

Configure account-specific fields

Configuring account-specific fields for multistep authentication requires adding:

  • authentication steps,
  • variables,
  • test API for the connector
  • And save.

  • Multistep Authentication: You have to click on + Add Step, then you will get options to select from such as FORM and API REQUEST.

    You can add multiple steps with various combinations of forms and API requests.

    • FORM: After selecting the form it will ask you to provide details such as the form modal tile and to add input keys. The input keys can consist of text, email, number, and password. This is for the end-user to provide details to the backend, to have successful authentication. You can add multiple input keys such as:

      • Text: to have only text type of input in the form.
      • Number: to provide numeric values for the form.
      • Email: to specify email ID as input type with right email ID format.
      • Password: to save password type input.

      Once you add the input keys, output variables for the respective keys will be autogenerated. To see what it looks like, click “Test auth steps” – you should see a modal appear asking you to enter in some credentials.

      Enter a few dummy information, and afterward present the structure. The response for auth steps will be shown below.

      The variables of this form can be used in further steps.

    • API REQUEST: Here’s where you should configure it to make an API request to your server to obtain an authentication token. Simply provide the URL, from where you want to get back the request call output.

      This auto generates two default variables of body and headers.

  • Configure the variable: This section is to save the authentication token which we get back from the server, in a variable.
    These variables will be added into this API endpoints for all your added Api’s automatically in respective locations Querystring/header/body

  • Configure test API for your connector: Add a simple API endpoint to test user credentials. DronaHQ includes data from your input form in the URL Params by default; click Advanced to customize the API call if your API expects them in the header instead.

After configuring all the details, you simply have to save it after successful testing of it.

Authenticate using form + API request

  1. Add third-party connector of Rest API, under Studio > Connectors, click (+) Connector.

  2. Provide a name for the API and select Multistep Authentication as the authentication type.

  3. Under Multistep Authentication add the first step as FORM. Provide a name for it along with two input keys for Email and Password.

  4. Add second step under the same, API REQUEST with POST method. We will be using a XANO endpoint here to fetch the details like authentication token from the server.

    • Also go to the advance section of the API request step. Select content type as RAW and insert the following code in the BODY/FORM PARAMETERS.
      { “email”: “{{form1.Email}}”, “password”: “{{form1.Password}}” }

    This will connect the FORM variables to the API REQUEST step for authentication as input variables.
    You can test your auth steps.

  5. Next, we have to configure the variable which will have the authentication token saved in it. The auth token will be further used in the Header to validate the authentication. These variables will be added to this API endpoint in respective locations Querystring/header/body.
    Key: Authorization Value: Bearer {{http2.body.authToken}} Location: In Header

  6. Now add your endpoint URL from where you want to fetch the user details after successful authentication with GET method.

  7. Click on Test Connection.

  8. Click Save. Now your API is ready to be used in your app.

Authenticate using API request + form + API request

Under this type of authentication, we will first pass on a valid credential and fetch the auth token as well as the header. Next, with the help of the form, we will specify an ID of which we will fetch the details later by a GET request from the endpoint URL.

  1. Add third-party connector of Rest API, under Studio > Connectors, click (+) Connector.

  2. Provide a name for the API and select Multistep Authentication as the authentication type.

  3. Under Multistep Authentication add the first step as API Request. Set its method as POST as we will be sending valid credentials to the endpoint. Specify the credential in the advance > content type (RAW) > Body/Form parameters.

  4. In the next step add a FORM with input key as post_ID with type number. This will be used to pass a specific ID to the endpoint in order to fetch details of that ID only.

  5. Now, add the final step of API Request with GET method to fetch the details and we will be passing the post ID in the URL along with Auth Token as a header in advance> Headers.

  6. You can try the test auth steps.

  7. Let’s save the authentication token we got back from the server by configuring the variable for it. Add variables of Authorization (having the auth token).

  8. Now to send the data to a subcategory endpoint URL we will use a POST method under Configure test API for your Connector. Set the Content-Type as RAW under the Advance section and add a body parameter that you want to get saved in the backend database.

  9. Do a Test Connection. You will see that your data with a unique post ID gets saved in the database.

  10. Click Save Your API is now ready to be used.