> For the complete documentation index, see [llms.txt](https://dev.ubidots.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://dev.ubidots.com/dashboards-and-widgets/html-canvas/content-security-policy-csp-restrictions.md).

# Content Security Policy (CSP) restrictions

### Content Security Policy (CSP) restrictions

Ubidots enforces a Content Security Policy (CSP) on application domains to protect end users against cross-site scripting (XSS) and code-injection attacks. This policy applies to all custom code running inside an application, which includes both **HTML Canvas widgets** and **Ubidots Pages**.

Because of this policy, some coding patterns that browsers would normally allow are blocked at the application level. Code that doesn't follow the guidelines below may silently fail to execute, even if it works in a local environment or in the widget's preview.

> **Note:** The policy is enforced per application domain. A widget or page may behave differently on `industrial.ubidots.com` than on your white-label application domain (e.g., `app.yourcompany.com`). Always test your custom code on the same domain your end users access.

#### 1. Inline JavaScript is not executed

The CSP does not allow inline scripts. This means the following patterns will be blocked:

* Inline event handler attributes in HTML, such as `onclick`, `onchange`, `onsubmit`, `onload`, etc.
* `<script>` blocks written directly inside the HTML tab (or inside a Page's HTML).
* `javascript:` URLs in links or buttons.

**All JavaScript must live in the JavaScript tab** of the HTML Canvas (or the JavaScript section of a Page), and event handlers must be attached programmatically using `addEventListener`.

❌ **Blocked — inline handler in the HTML tab:**

```html
<button id="export-btn" onclick="exportData()">Export</button>
```

✅ **Allowed — element in the HTML tab, logic in the JavaScript tab:**

```html
<!-- HTML tab -->
<button id="export-btn">Export</button>
```

```javascript
// JavaScript tab
document.getElementById('export-btn').addEventListener('click', exportData);

function exportData() {
  // Same logic as before — no functional changes required
}
```

Migrating from inline handlers to event listeners requires no changes to your business logic: the same functions are invoked, only the way they are bound to the DOM changes.

#### 2. Avoid dynamic code evaluation

Avoid APIs that compile code from strings, as they may be blocked by the policy:

* `eval()`
* `new Function('...')`
* `setTimeout('...' /* string */)` and `setInterval('...' /* string */)` — always pass a function reference instead of a string.

#### 3. Loading external scripts and libraries

* Load third-party libraries through the widget's **Third-party libraries** setting (see [Third-party packages](https://claude.ai/dashboards-and-widgets/html-canvas/3rd-party-packages.md)) rather than injecting `<script>` tags from the HTML tab.
* External scripts must be served over **HTTPS**. Scripts loaded over HTTP will be blocked.
* Some external script sources may be restricted on hardened application domains. If a library or external API (for example, a maps or charting provider) fails to load for end users, check the browser console for CSP errors and contact Ubidots support so the required origin can be reviewed.

#### 4. Styles

Inline styles (the `style` attribute and `<style>` blocks) are currently permitted. However, we recommend keeping all styling in the **CSS tab** for maintainability and to future-proof your widgets against further policy hardening.

#### Troubleshooting CSP issues

If a button stops responding, a modal opens empty, or part of your widget/page does not render, open the browser's developer console (F12 → Console). CSP violations are reported with messages such as:

<figure><img src="/files/OJ7C1UGAexwPoABA44jY" alt=""><figcaption></figcaption></figure>

```
Refused to execute inline script because it violates the following
Content Security Policy directive: "script-src 'self' ..."
```

or

```
Refused to load the script 'https://example.com/lib.js' because it
violates the following Content Security Policy directive: ...
```

Common fixes:

| Symptom                                                                     | Likely cause                            | Fix                                                                                                      |
| --------------------------------------------------------------------------- | --------------------------------------- | -------------------------------------------------------------------------------------------------------- |
| A button or control does nothing when clicked                               | Inline `onclick`/`onchange` handler     | Move the logic to the JavaScript tab and bind it with `addEventListener`                                 |
| A `<script>` block in the HTML tab never runs                               | Inline script blocked                   | Move the code to the JavaScript tab                                                                      |
| An external library or map fails to load for end users but works for owners | Script origin blocked on the app domain | Verify the HTTPS source, load it via *Third-party libraries*, and contact support if it is still blocked |
| Code works in preview but not in the published app                          | Different CSP between domains           | Test on the end-user application domain                                                                  |


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## 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, and the optional `goal` query parameter:

```
GET https://dev.ubidots.com/dashboards-and-widgets/html-canvas/content-security-policy-csp-restrictions.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

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.
