# JS SDK

{% hint style="info" %}
Currently only supports use in web browser environments. Please contact Support if you are interested in using the JS SDK in another environment.
{% endhint %}

The DFend JS SDK is a lightweight client library that makes it easy to interact with the DFend API from a JavaScript environment.

## **Load the SDK**

```html
<script defer="defer" src="https://js.dfend.app/sdk/v0/client.js"></script>
```

### Create an instance

```javascript
const dfend = DFend('<Publishable API Key>');
```

{% hint style="warning" %}
Do not use the **`new`** keyword.
{% endhint %}

## Methods

<details>

<summary>push   <em><mark style="color:green;">async</mark></em></summary>

Send us a Signal.

#### Example

```javascript
const userId = 'qkHIslwhyFxHVvNg'; // user.id
const { immediateResults } = await dfend.push({
  idempotencyKey: `${userId}-${new Date().getTime()}`,
  type: 'PageLoad',
  identifiers: {
    userId
  }
});
```

#### Params

1. `signal`  <mark style="color:blue;">object</mark>  An object containing the following subset of [Signal](https://dfend.gitbook.io/documentation/developer-api/types/signal) fields that are suitable for sending from a client environment:
   * `idempotencyKey`  <mark style="color:blue;">string</mark>  Prevent duplicate events by providing a unique key for this signal.
   * `type`  <mark style="color:blue;">string</mark>  A custom string value representing the type of event.
   * `identifiers`  <mark style="color:blue;">object</mark>  An object containing at least one of the following fields:
     * `userId`  <mark style="color:blue;">string</mark>  The user's primary key or unique ID in your system.
     * `identity`  <mark style="color:blue;">string</mark>  The `id` value of the user's [Identity](https://dfend.gitbook.io/documentation/developer-api/types/identity) in DFend.

#### Returns

A Promise resolving with a `response` object containing the following fields:

* `started`  <mark style="color:blue;">number</mark>  A Unix timestamp (ms).
* `finished`  <mark style="color:blue;">number</mark>  A Unix timestamp (ms).
* `immediateResults`  <mark style="color:blue;">ImmediateResult\[]</mark>  An array of [ImmediateResult](https://dfend.gitbook.io/documentation/developer-api/types/immediateresult) objects.

</details>

<details>

<summary>checkOptedIn   <em><mark style="color:green;">async</mark></em></summary>

Check whether a user has opted into DFend.

#### Example

```javascript
const userId = 'qkHIslwhyFxHVvNg'; // user.id
const { optedIn } = await dfend.checkOptedIn({ userId });
```

#### Params

1. `identifiers`  <mark style="color:blue;">object</mark>  An object containing at least one of the following fields:
   * `userId`  <mark style="color:blue;">string</mark>  The user's primary key or unique ID in your system.
   * `identity`  <mark style="color:blue;">string</mark>  The `id` value of the user's [Identity](https://dfend.gitbook.io/documentation/developer-api/types/identity) in DFend.

#### Returns

A Promise resolving with a `response` object containing the following fields:

* `optedIn`  <mark style="color:blue;">boolean</mark>  A boolean indicating whether the user has opted in.

</details>

<details>

<summary>getOptInUrl</summary>

Get the URL for the page where a user can opt into DFend.

#### Example

```javascript
const userId = 'qkHIslwhyFxHVvNg'; // user.id
const url = dfend.getOptInUrl(userId);
```

#### Params

1. `userId`  <mark style="color:blue;">string</mark>  The user's primary key or unique ID in your system.

#### Returns

* `url`  <mark style="color:blue;">string</mark>  The opt in URL.

</details>

<details>

<summary>getOptOutUrl</summary>

Get the URL for the page where a user can opt out of DFend.

#### Example

```javascript
const userId = 'qkHIslwhyFxHVvNg'; // user.id
const url = dfend.getOptOutUrl(userId);
```

#### Params

1. `userId`  <mark style="color:blue;">string</mark>  The user's primary key or unique ID in your system.

#### Returns

* `url`  <mark style="color:blue;">string</mark>  The opt out URL.

</details>