# Content Security Policy

A common layer of security used by many websites is a [Content Security Policy](https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP). These policies help prevent unauthorized access to website visitor data, and can help mitigate certain types of website attacks. If your website employs the use of a CSP, it will be important to whitelist the Lucky Orange tracking script in order for features like recordings, chat, and the heatmap tool to function properly.

## Necessary policy additions

<table data-header-hidden><thead><tr><th width="140.76953125">Directive</th><th width="520.7578125">Value</th></tr></thead><tbody><tr><td>Directive</td><td>Value</td></tr><tr><td><strong>connect-src</strong></td><td><p>https://*.luckyorange.com</p><p>https://pubsub.googleapis.com</p><p>wss://*.visitors.live</p></td></tr><tr><td><strong>script-src</strong></td><td>https://tools.luckyorange.com<br>https://storage.googleapis.com/lucky-orange-public/heatmap2/*</td></tr><tr><td><strong>worker-src</strong></td><td>blob:</td></tr></tbody></table>

{% hint style="info" %}
**Note:** The `blob:` directive is used to improve the performance of our code by performing certain actions within a web worker. The `googleapis.com` directive is used as fallback in the rare event our own data ingestion pipeline is unavailable.
{% endhint %}

{% hint style="info" %}
Note: The `https://storage.googleapis.com/lucky-orange-public/heatmap2/*` directive is used by our heatmap tool. You do not need to add this if you do not plan to use our heatmap tool.&#x20;
{% endhint %}

{% hint style="warning" %}
**Note:** For most sites, the additions in the table above will be enough. However, if you notice live chat, surveys, or announcements that are not being triggered and you aren't able to see live visitors, you may need to add the below additional value to the **connect-src** directive. You can check for errors in the console of the tracked site or reach out to Lucky Orange support if you are unsure.

`wss://realtime.luckyorange.com/mqtt`
{% 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://developers.luckyorange.com/libraries/browser/content-security-policy.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.