# Stitch Connect JavaScript Client
## Introduction
The Stitch Connect JavaScript Client is a library for integrating Stitch’s data source creation and configuration workflows seamlessly into your web application. Using a pop-up window, end-users can:
* Create a source of a particular type, such as Marketo or Salesforce
* Authorize an existing source
* Run a connection check for an existing source and discover its schema
* Select streams (tables) to replicate for an existing source
* Edit an existing source
### Data sources and connection steps
Stitch data sources require a unique sequence of [connection steps](https://help.qlik.com/en-US/stitch/developers/stitch-connect/api#connection-step-object) specific to the source `type` to be fully configured.
When a user is sent to a particular step using the JavaScript client, the user will also be prompted to complete any successive steps to complete configuration of the source.
For example: When the `addSource` function is used, the user will be prompted to first add the data source. The user will next be directed to authorize the source and select the streams they want to replicate.
## Versioning
As of September 21, 2026, the current version of the JavaScript client is **version 1.x.x**.
Refer to the [Releases](https://github.com/stitchdata/stitch-js/releases) page in the [Stitch JS GitHub repo](https://github.com/stitchdata/stitch-js) to for updated release packages.
## Installation
Visit the [Stitch JS GitHub repo](https://github.com/stitchdata/stitch-js/releases) and download the latest release.
In your application, add this `
```
Make sure to replace `` with the directory location of the `stitch-client.umd.min.js` file.
## Error codes
| **Code** | **Response text** | **Description** |
| --- | --- | --- |
| **AppClosedPrematurelyError** | `"App closed before reaching end of flow."` | The user closed the Stitch app before successfully completing the task. |
| **SourceNotFoundError** | ``"`Integration with id ${id} not found.`"`` | The provided source ID is invalid. |
| **UnknownSourceTypeError** | ``"`Unknown source type: "${type}".`"`` | The provided source `type` is invalid. |
| **UpgradeEphemeralTokenError** | `"Error upgrading ephemeral token."` | There was an issue with updating the session’s ephemeral token. |
## Functions
The JavaScript client supports the functions listed below. All of the functions expect an `options` object as the only argument and return a `Promise`.
FUNCTION
#### addSource(options)
Initiates the creation of a source in the user’s Stitch client account.
##### Arguments
The `addSource` function expects an `options` object as the only argument. This object must contain all parameters marked as REQUIRED:
| **type**
STRING
REQUIRED | The source type. For example: `platform.hubspot` or `platform.marketo`. |
| --- | --- |
| **ephemeral\_token**
STRING
OPTIONAL | The token used to automatically log the user into the Stitch client account. Retrieved by creating a session using the Connect API’s [Create a Session endpoint](https://help.qlik.com/en-US/stitch/developers/stitch-connect/api#create-a-session).
If the token is not provided, the user may be prompted to sign into their Stitch account.
The ephemeral token expires one hour after generation. When specified as an argument in a Connect JavaScript function, the ephemeral token is exchanged for a session token, creating a temporary Stitch session for the user. The session expires once terminated or 12 hours after its creation. |
| **default\_streams**
OBJECT
OPTIONAL | Sets the default selections for the data structures (tables) to be replicated during the source integration setup. Should be an object of the form `{"table_name": true}`. For example:
```
"default_streams":{
"campaigns":true,
"companies":true
}
```
Additionally, note that:
- Only top-levels may be provided
- If a table name is provided that the integration doesn’t support, it will be ignored
- Values other than
true will be ignored
|
#### Example usage
* Function
* Result
The code below will create a HubSpot integration (`type: platform.hubspot`) in the user’s Stitch account, with the `campaigns` and `companies` tables pre-selected for replication.
```
```
```
Stitch.addSource({
"type": "platform.hubspot",
"ephemeral_token": "",
"default_streams":{
"campaigns": true,
"companies": true
}
}).then((result) => {
console.log(`Integration created, type=${result.type}, id=${result.id}`);
}).catch((error) => {
console.log("Integration not created.", error);
});
```
Stitch.js will send the user to Stitch and open the Integration Settings page, where the user can configure the integration.
```
```
```
```
FUNCTION
#### authorizeSource(options)
Sends the user to Stitch, which will redirect to the third-party to complete an OAuth handshake.
##### Arguments
The `authorizeSource` function expects an `options` object as the only argument. This object must contain all parameters marked as REQUIRED:
| **id**
INTEGER
REQUIRED | The unique identifier for the source. For example: `12345` |
| --- | --- |
| **ephemeral\_token**
STRING
OPTIONAL | The token used to automatically log the user into the Stitch client account. Retrieved by creating a session using the Connect API’s [Create a Session endpoint](https://help.qlik.com/en-US/stitch/developers/stitch-connect/api#create-a-session).
If the token is not provided, the user may be prompted to sign into their Stitch account.
The ephemeral token expires one hour after generation. When specified as an argument in a Connect JavaScript function, the ephemeral token is exchanged for a session token, creating a temporary Stitch session for the user. The session expires once terminated or 12 hours after its creation. |
| **default\_streams**
OBJECT
OPTIONAL | Sets the default selections for the data structures (tables) to be replicated during the source integration setup. Should be an object of the form `{"table_name": true}`. For example:
```
"default_streams":{
"campaigns":true,
"companies":true
}
```
Additionally, note that:
- Only top-levels may be provided
- If a table name is provided that the integration doesn’t support, it will be ignored
- Values other than
true will be ignored
|
#### Example usage
* Function
* Result
The code below will first send the user to Stitch and then re-direct to the appropriate third-party to complete an OAuth handshake.
```
```
```
Stitch.authorizeSource({
"id": 45612,
"ephemeral_token": ""
}).then((result) => {
console.log(`Integration created, type=${result.type}, id=${result.id}`);
}).catch((error) => {
console.log("Integration not created.", error);
});
```
Stitch.js will send the user to Stitch and then re-direct to the appropriate third-party to complete an OAuth handshake.
In this example, the source being authorized is HubSpot (`type: platform.hubspot`).
```
```
```
```
FUNCTION
#### displayDiscoveryOutputForSource(options)
Checks the source’s connection and discovers its schema.
##### Arguments
The `displayDiscoveryOutputForSource` function expects an `options` object as the only argument. This object must contain all parameters marked as REQUIRED:
| **id**
INTEGER
REQUIRED | The unique identifier for the source. For example: `12345` |
| --- | --- |
| **discovery\_job\_name**
STRING
REQUIRED | When a source is updated, Stitch will run a [connection check](https://help.qlik.com/en-US/stitch/developers/stitch-connect/api) to test the source’s connection parameters and discover its schema. This value is the name of the job that should be displayed.
To initiate a connection check, use the [Update a Source](https://help.qlik.com/en-US/stitch/developers/stitch-connect/api#update-a-source) endpoint. The `check_job_name` attribute in the response will contain a discovery job name. |
| **ephemeral\_token**
STRING
OPTIONAL | The token used to automatically log the user into the Stitch client account. Retrieved by creating a session using the Connect API’s [Create a Session endpoint](https://help.qlik.com/en-US/stitch/developers/stitch-connect/api#create-a-session).
If the token is not provided, the user may be prompted to sign into their Stitch account.
The ephemeral token expires one hour after generation. When specified as an argument in a Connect JavaScript function, the ephemeral token is exchanged for a session token, creating a temporary Stitch session for the user. The session expires once terminated or 12 hours after its creation. |
| **default\_streams**
OBJECT
OPTIONAL | Sets the default selections for the data structures (tables) to be replicated during the source integration setup. Should be an object of the form `{"table_name": true}`. For example:
```
"default_streams":{
"campaigns":true,
"companies":true
}
```
Additionally, note that:
- Only top-levels may be provided
- If a table name is provided that the integration doesn’t support, it will be ignored
- Values other than
true will be ignored
|
#### Example usage
* Function
* Result
The code below will run a connection check, discover the schema for source `45612`, and output the results.
```
```
```
Stitch.displayDiscoveryOutputForSource({
"id": 45612,
"discovery_job_name": "1234-45612-4567891234-checks"
}).then((result) => {
console.log(`Integration created, type=${result.type}, id=${result.id}`);
}).catch((error) => {
console.log("Integration not created.", error);
});
```
Stitch.js will run a connection check and output the source’s schema. The example below is for source `platform.hubspot`.
```
```
```
```
FUNCTION
#### selectStreamsForSource(options)
Selects the tables and fields that should be replicated from the source.
##### Arguments
The `selectStreamsForSource` function expects an `options` object as the only argument. This object must contain all parameters marked as REQUIRED:
| **id**
INTEGER
REQUIRED | The unique identifier for the source. For example: `12345` |
| --- | --- |
| **ephemeral\_token**
STRING
OPTIONAL | The token used to automatically log the user into the Stitch client account. Retrieved by creating a session using the Connect API’s [Create a Session endpoint](https://help.qlik.com/en-US/stitch/developers/stitch-connect/api#create-a-session).
If the token is not provided, the user may be prompted to sign into their Stitch account.
The ephemeral token expires one hour after generation. When specified as an argument in a Connect JavaScript function, the ephemeral token is exchanged for a session token, creating a temporary Stitch session for the user. The session expires once terminated or 12 hours after its creation. |
| **default\_streams**
OBJECT
OPTIONAL | Sets the default selections for the data structures (tables) to be replicated during the source integration setup. Should be an object of the form `{"table_name": true}`. For example:
```
"default_streams":{
"campaigns":true,
"companies":true
}
```
Additionally, note that:
- Only top-levels may be provided
- If a table name is provided that the integration doesn’t support, it will be ignored
- Values other than
true will be ignored
|
#### Example usage
* Function
* Result
The code below will prompt the user to select the streams (tables) they want to replicate for source `45612`.
```
```
```
Stitch.selectStreamsForSource({
"id": 45612,
"ephemeral_token": ""
}).then((result) => {
console.log(`Integration created, type=${result.type}, id=${result.id}`);
}).catch((error) => {
console.log("Integration not created.", error);
});
```
Stitch.js will display the streams available for replication. The example below lists the streams for source `platform.hubspot`.
```
```
```
```
FUNCTION
#### editSource(options)
Edits the source form and settings.
##### Arguments
The `editSource` function expects an `options` object as the only argument. This object must contain all parameters marked as REQUIRED:
| **id**
INTEGER
REQUIRED | The unique identifier for the source. For example: `12345` |
| --- | --- |
| **ephemeral\_token**
STRING
OPTIONAL | The token used to automatically log the user into the Stitch client account. Retrieved by creating a session using the Connect API’s [Create a Session endpoint](https://help.qlik.com/en-US/stitch/developers/stitch-connect/api#create-a-session).
If the token is not provided, the user may be prompted to sign into their Stitch account.
The ephemeral token expires one hour after generation. When specified as an argument in a Connect JavaScript function, the ephemeral token is exchanged for a session token, creating a temporary Stitch session for the user. The session expires once terminated or 12 hours after its creation. |
| **default\_streams**
OBJECT
OPTIONAL | Sets the default selections for the data structures (tables) to be replicated during the source integration setup. Should be an object of the form `{"table_name": true}`. For example:
```
"default_streams":{
"campaigns":true,
"companies":true
}
```
Additionally, note that:
- Only top-levels may be provided
- If a table name is provided that the integration doesn’t support, it will be ignored
- Values other than
true will be ignored
|
#### Example usage
* Function
* Result
The code below will send the user to Stitch and open the Integration Settings page for source `45612`, where the source’s settings can be updated.
```
```
```
Stitch.editSource({
"id": 45612,
"ephemeral_token": ""
}).then((result) => {
console.log(`Source updated, type=${result.type}, id=${result.id}`);
}).catch((error) => {
console.log("Editing source failed.", error);
});
```
Stitch.js will display the Integration Settings page for the source, where the user can update the source’s configuration settings.
```
```
```
```