# Web SDK Setup

## 1. Requirements

[Sign up](https://console.flarelane.com) to FlareLane and create a project.

***

## 2. Start Setup

Click **Channel** > **Web Push** to start setup.

<figure><img src="/files/5AXFJuPMeTcMXhRE580s" alt=""><figcaption></figcaption></figure>

***

## 3. Input Website Details

<figure><img src="/files/61w26FMKfTmSiVRr3AMW" alt="" width="563"><figcaption></figcaption></figure>

<table><thead><tr><th width="165"> </th><th>Description</th></tr></thead><tbody><tr><td><strong>Website Name</strong></td><td>Website name will be auto-filled when message title is left blank</td></tr><tr><td><strong>Website URL</strong></td><td>URL must be started with "https://"</td></tr></tbody></table>

***

## 4. Upload sw\.js

Download [sw.js](https://gp.flarelane.com/sw.js) file and upload it to the root path of your website. (ex. If the file sw\.js is located in the 'example.com' domain, it should be accessible at **example.com/sw\.js**)

{% tabs %}
{% tab title="sw\.js" %}

```javascript
importScripts("https://cdn.flarelane.com/ServiceWorker.js");
```

{% endtab %}
{% endtabs %}

If you upload it correctly, you should be able to access it externally like this:

<https://gp.flarelane.com/sw.js>

***

## 5. SDK Setup

{% hint style="info" %}
You can check your project ID at FlareLane console's **Project**
{% endhint %}

Add the following script right before the \</body> tag of your website.

```html
<script src="https://cdn.flarelane.com/WebSDK.js" charset="UTF-8"></script>
<script>FlareLane.initialize({ projectId: "PROJECT_ID" });</script>
```

***

## 6. Test

<figure><img src="/files/F5W2wh8mpw9v6zWmFGwC" alt="" width="331"><figcaption></figcaption></figure>

If everything has been set up correctly, a prompt asking for permission to subscribe will appear when the website is refreshed.&#x20;

Then, you can proceed with the detailed setting such as the setting up an icon at FlareLane console's **Channel** > **Web Push**.

***

## 7. Identify your user

FlareLane's device is 'anonymous' and you can match the device with your user based on the unique user ID that identifies your user.

{% hint style="info" %}
Setting up [User ID](/data-integration/user-id.md) has many benefits. You can distinguish whether a user has signed-up, and push notifications can be sent based on the User ID.
{% endhint %}

Usually, when a user sign-up or log-in, you should execute `setUserId`.

{% tabs %}
{% tab title="JavaScript" %}

```javascript
FlareLane.setUserId("USER_ID");
```

{% endtab %}
{% endtabs %}

***

## 8. Additional Setup

To use [Journeys](/customer-journey.md) or [Message Personalization](broken://pages/Z8YOEAwK3zXqYXBmgIAm), integrate custom data via SDK or API:

* [Data Integration](/data-integration.md)


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://guide.flarelane.com/guide-for-developers/web-sdk-setup.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
