# Live Refresh

The Web Socket option under the ***Live Refresh*** icon is provided to refresh the Story or the selected Views of the Story when an external event occurs.&#x20;

{% hint style="success" %}
*Check out the given illustration to understand the **Live Refresh** functionality.*
{% endhint %}

{% embed url="<https://files.gitbook.com/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fb3U3HdVsN1h9bZt2fgoH%2Fuploads%2Fx3P0d6BfUjdiYp6GEMlN%2FLive%20Refresh.mp4?alt=media&token=b1e91ac4-4401-4cb7-96e4-ee889ccd8c95>" %}
***Live Refresh feature in action***
{% endembed %}

\
Users can achieve this by configuring a WebSocket. The WebSocket Configuration contains a WebSocket IP and a message. On opening a WebSocket-enabled story, a WebSocket channel is established to receive messages. The story gets refreshed when Web Socket receives the same message configured from this channel.

* Navigate to a Storyboard of any Story with multiple Views.
* Click the ***Live Refresh*** icon.    &#x20;

<figure><img src="https://750268497-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRaZBXhWvWF2Al5nTd3kg%2Fuploads%2F0Ejph8UGQuEZNcy7oCCC%2Fimage.png?alt=media&#x26;token=b71754e2-8d69-409d-914f-e3f84ef821c7" alt=""><figcaption><p><em><strong>Accessing the Live Refresh icon for a Story</strong></em></p></figcaption></figure>

* The ***WebSocket*** panel opens.
* Enable ***WebSocket*****&#x20;functionality**.&#x20;
* Provide a ***WebSocket IP***.&#x20;
* Insert a message based on which the selected view(s) get updated.&#x20;
* Either enable ***Refresh All*** option or keep it *disabled* (based on the requirement).
* If it is disabled then select the required ***Views*** from the ***Available Views*** list as provided under the ***Selected Views*** heading.&#x20;
  * Use the Check All option to select all the Views.
  * Select a specific View by using the Checkbox provided next to it.
* Click the ***Apply*** icon from the above panel. &#x20;

<figure><img src="https://750268497-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRaZBXhWvWF2Al5nTd3kg%2Fuploads%2FQljn70Jodis5eRz296Li%2Fimage.png?alt=media&#x26;token=852a8194-f592-4132-8a80-5c0995f22d12" alt=""><figcaption><p><em><strong>WebSocket Panel</strong></em></p></figcaption></figure>

{% hint style="info" %}
*<mark style="color:green;">Please Note</mark>: When the event trigger&#x73;**, the story gets refreshed data based on the WebSocket settings**.*
{% endhint %}

* The user can keep track of each trigger under the Developer's tool (as displayed in the following image).&#x20;

<figure><img src="https://750268497-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRaZBXhWvWF2Al5nTd3kg%2Fuploads%2FL715dqvsBRjLlZXo7uuW%2Fimage.png?alt=media&#x26;token=4fe2d3bf-cee7-4c03-82c3-9755a93ceb43" alt=""><figcaption><p><em><strong>Count of WS triggers</strong></em> </p></figcaption></figure>

{% hint style="info" %}
*<mark style="color:green;">Please Note</mark>: The WebSocket IP used for the Live Refresh functionality has been accessed using the* [***WebSocket Producer***](https://docs.bdb.ai/data-pipeline/components/producers/websocket-producer) *component provided inside the* [***Data Pipeline*** ](https://app.gitbook.com/o/BHXEmSpD7W3xDgxnOIpk/s/uq3RSHHup7fjHYaspk7y/)*module of the Platform.*
{% endhint %}


---

# 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://docs.bdb.ai/self-service-visualization-2/storyboard/live-refresh.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.
