> For the complete documentation index, see [llms.txt](https://docs.ownchat.app/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.ownchat.app/whatsapp-channel/flow-builder/api-configuration.md).

# API Configuration

The **API Configuration** feature in Ownchat Flow Builder allows you to integrate external systems by making **API requests** within workflows.

This enables businesses to:

* Fetch external data
* Send data to third-party systems
* Integrate backend services (CRM, ERP, etc.)
* Automate workflows based on API responses

### Overview  

API Configuration enables workflows to interact with external systems using configured API connections and data exchange actions.<br>

{% embed url="<https://app.supademo.com/demo/cmp3olo5m00wz0jv0rkfa7tgu?utm_source=link>" %}

#### Workflow Flow &#x20;

Trigger Event\
&#x20;     ↓\
API Action (Data Exchange)\
&#x20;     ↓\
API Request Sent\
&#x20;     ↓\
Response Received\
&#x20;     ↓\
Success / Failure Navigation\
&#x20;     ↓\
Next Workflow Step

### Prerequisites &#x20;

#### Required Access &#x20;

* Ownchat account
* Flow Builder access
* API endpoint details

#### Required API Information &#x20;

* API URL
* Authentication details
* Request/response structure

### Adding API Configuration Action &#x20;

#### Step 1: Add Action &#x20;

Open the Flow Builder. After creating the flow, you can set the API connection in the footer section of the Flow Builder.

#### Step 2: Edit Action &#x20;

1. Click **Edit Action** to configure API settings<br>

{% embed url="<https://app.supademo.com/demo/cmp3omxji00x00jv08eixamlx?utm_source=link>" %}

#### Step 3: Select Action Type &#x20;

1. Select **data\_exchange** from the dropdown

data\_exchange<br>

{% embed url="<https://app.supademo.com/demo/cmp3oobex00x70jw37zn36162?utm_source=link>" %}

This defines the action as an API integration step.

### Configuring API Integration &#x20;

#### Step 1: Select or Create API Integration &#x20;

1. Click the dropdown to **Select or Create API Integration**<br>

{% embed url="<https://app.supademo.com/demo/cmp3oqkf600xa0jw394hrls91?utm_source=link>" %}

2. Choose an existing configuration OR create a new one

#### Step 2: Create New API Configuration &#x20;

1. Click:

Create New Config<br>

{% embed url="<https://app.supademo.com/demo/cmp3orgx5006p0jwgy595rjd3?utm_source=link>" %}

This allows you to create a new API setup.

### Managing API Connections &#x20;

#### Step 1: Open API Connections &#x20;

**Click:**

API Connections<br>

{% embed url="<https://app.supademo.com/demo/cmp3osc90007c0jtl46t3k59q?utm_source=link>" %}

This section is used to manage all API integrations.

#### Step 2: Add New Connection &#x20;

**Click:**

Add Connection<br>

{% embed url="<https://app.supademo.com/demo/cmp3otdjv00tx0juz7dedcaaz?utm_source=link>" %}

#### Step 3: Enter Connection Details &#x20;

**Title** &#x20;

Enter a descriptive name:

Customer API<br>

{% embed url="<https://app.supademo.com/demo/cmp3ouz7b00xf0jw3jm4oj8nu?utm_source=link>" %}

**URL** &#x20;

Enter the API endpoint:

<https://api.example.com/data><br>

{% embed url="<https://app.supademo.com/demo/cmp3ovtgu00xa0jv0pjp639eo?utm_source=link>" %}

#### Step 4: Save Connection &#x20;

**Click:**

Create

The API connection will be saved successfully.<br>

{% embed url="<https://app.supademo.com/demo/cmp3owwv2007d0jtl2seueul3?utm_source=link>" %}

#### Step 5: View Created Connections &#x20;

The created API connections will be listed under:

API Connections<br>

{% embed url="<https://app.supademo.com/demo/cmp3oy83y00xg0jw3kozwszy4?utm_source=link>" %}

### Configuring API Action Details

{% embed url="<https://app.supademo.com/demo/cmp3p0lot007e0jtltjre6hu6?utm_source=link>" %}

#### Step 1: Enter API Name &#x20;

Enter a title for the API:

Fetch API Data<br>

{% embed url="<https://app.supademo.com/demo/cmp3p1xtm007f0jtl9ns8tpdc?utm_source=link>" %}

### Configuring Success Navigation &#x20;

#### Step 1: Select Success Screen &#x20;

1. Select a screen from the dropdown<br>

{% embed url="<https://app.supademo.com/demo/cmp3p2ze2008e0jwgjy3d49ry?utm_source=link>" %}

2. This defines where the workflow navigates after a successful API call

Example:

First Screen

### Configuring Failure Navigation &#x20;

#### Step 1: Select Failure Screen &#x20;

1. Select a screen from the dropdown<br>

{% embed url="<https://app.supademo.com/demo/cmp3p62y800w00juzkmhxb3nj?utm_source=link>" %}

2. This defines what happens when the API fails

Example:

Sample Screen

### Adding API Data &#x20;

#### Step 1: Add API Data &#x20;

Click:

Add API Data

This integrates external data into the workflow.<br>

{% embed url="<https://app.supademo.com/demo/cmp3p81xz007i0jtltdy18qfq?utm_source=link>" %}

#### Step 2: Confirmation Message &#x20;

A popup will appear:

API details created successfully<br>

{% embed url="<https://app.supademo.com/demo/cmp3p9bc3007k0jtla6vlbfsg?utm_source=link>" %}

#### Step 3: Select API Configuration &#x20;

Select the created API from the dropdown

Example:

Sample<br>

{% embed url="<https://app.supademo.com/demo/cmp3pafq300000jwx92rat2gz?utm_source=link>" %}

### Saving API Configuration &#x20;

#### Step 1: Update Component &#x20;

Click:

Update Component

This saves all API configuration changes.<br>

{% embed url="<https://app.supademo.com/demo/cmp3pbizh00010jwxa7fnc3re?utm_source=link>" %}

### Using API Response in Workflow &#x20;

After configuration, the API response can be used in:

* Messages
* Conditions
* Variables

Example:

{{api\_response.data}}

### Adding Conditional Logic (Optional) &#x20;

#### Step 1: Add IF Statement &#x20;

1. Click **Add Action**
2. Select **If Statement**

#### Step 2: Configure Condition &#x20;

**Variable** &#x20;

api\_response.status

**Data Type**&#x20;

String

**Operator** &#x20;

is

**Value** &#x20;

success

Disable **Dynamic Value** if using a static condition.

### Verifying Configuration &#x20;

Before publishing, verify:

* API connection
* Endpoint URL
* Success screen mapping
* Failure screen mapping
* API data integration

### Publishing the Workflow &#x20;

Click:

Publish

The workflow will become active.

### Testing the API Configuration &#x20;

**Steps** &#x20;

1. Trigger the workflow
2. Verify API request execution
3. Check success navigation
4. Check failure navigation
5. Validate API response usage

### Troubleshooting &#x20;

#### API Not Working &#x20;

Possible causes:

* Incorrect API URL
* Connection not created
* API not selected

#### Navigation Not Working &#x20;

Check:

* Success screen configuration
* Failure screen configuration

#### API Data Not Available &#x20;

Check:

* API data mapping
* API selection in dropdown

### Best Practices &#x20;

#### Use Descriptive Names &#x20;

Example:

Customer API Integration

#### Verify API Connections &#x20;

Always confirm the API connection is created and selected correctly.

#### Configure Proper Navigation &#x20;

Set both success and failure screens to avoid workflow breaks.

#### Test API Before Deployment &#x20;

Ensure the API works correctly before integrating.

### Summary &#x20;

The **API Configuration**  feature allows workflows to integrate external systems using API connections and data exchange actions.

Workflow process:

1. API connection is created
2. Data exchange action is configured
3. API request is executed
4. Response is processed
5. Workflow navigates based on success or failure

This enables powerful **real-time integrations and automation in Ownchat Flow Builder.**