Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

docs: HTML embedding of charts/dashboards without authentication #30032

Merged
merged 13 commits into from
Sep 18, 2024
59 changes: 58 additions & 1 deletion docs/docs/configuration/networking-settings.mdx
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@

---
title: Network and Security Settings
sidebar_position: 7
Expand All @@ -24,9 +25,65 @@ The following keys in `superset_config.py` can be specified to configure CORS:
## HTTP headers

Note that Superset bundles [flask-talisman](https://pypi.org/project/talisman/)
Self-descried as a small Flask extension that handles setting HTTP headers that can help
Self-described as a small Flask extension that handles setting HTTP headers that can help
protect against a few common web application security issues.


## HTML Embedding of Dashboards and Charts

There are two ways to embed a dashboard: Using the [SDK](https://www.npmjs.com/package/@superset-ui/embedded-sdk) or embedding a direct link. Note that in the latter case everybody who knows the link is able to access the dashboard.

### Embedding a Public Direct Link to a Dashboard

This works by first changing the content security policy (CSP) of [flask-talisman](https://github.com/GoogleCloudPlatform/flask-talisman) to allow for certain domains to display Superset content. Then a dashboard can be made publicly accessible, i.e. **bypassing authentication**. Once made public, the dashboard's URL can be added to an iframe in another website's HTML code.

#### Changing flask-talisman CSP

Add to `superset_config.py` the entire `TALISMAN_CONFIG` section from `config.py` and include a `frame-ancestors` section:
```python
TALISMAN_ENABLED = True
TALISMAN_CONFIG = {
"content_security_policy": {
...
"frame-ancestors": ["*.my-domain.com", "*.another-domain.com"],
...
```
Restart Superset for this configuration change to take effect.

#### Making a Dashboard Public
lindner-tj marked this conversation as resolved.
Show resolved Hide resolved

1. Add the `'DASHBOARD_RBAC': True` [Feature Flag](https://github.com/apache/superset/blob/master/RESOURCES/FEATURE_FLAGS.md) to `superset_config.py`
2. Add the `Public` role to your dashboard as described [here](https://superset.apache.org/docs/using-superset/creating-your-first-dashboard/#manage-access-to-dashboards)

#### Embedding a Public Dashboard

Now anybody can directly access the dashboard's URL. You can embed it in an iframe like so:

```html
<iframe
width="600"
height="400"
seamless
frameBorder="0"
scrolling="no"
src="https://superset.my-domain.com/superset/dashboard/10/?standalone=1&height=400"
>
</iframe>
```
#### Embedding a Chart

A chart's embed code can be generated by going to a chart's edit view and then clicking at the top right on `...` > `Share` > `Embed code`

### Enabling Embedding via the SDK

Clicking on `...` next to `EDIT DASHBOARD` on the top right of the dashboard's overview page should yield a drop-down menu including the entry "Embed dashboard".

To enable this entry, add the following line to the `.env` file:

```text
SUPERSET_FEATURE_EMBEDDED_SUPERSET=true
```

## CSRF settings

Similarly, [flask-wtf](https://flask-wtf.readthedocs.io/en/0.15.x/config/) is used manage
Expand Down
Loading