Embed Dashboard Without Superset UI

[wacree06]

Hello. I am currently building an LLM to take a user prompt and, using an MCP, build a dashboard/chart using Superset. I got the llm/mcp hooked up to Superset and it does what it's supposed to, but in the frontend, I want a user to be able to prompt it, and then have the app immediately render what the llm built. Is it possible to get a dashboard to render without needing to use the superset ui to enable embedding for that specific dashboard? I think it might be some settings to do with CORS in superset_config.py, but nothing I've done has worked so far.

[dosubot[bot]]

Hi @wacree06! I'm Dosu and I’m helping the superset team.

Yes, you can embed a Superset dashboard in your frontend without manually enabling embedding via the Superset UI. You need to configure Superset to support embedding and then programmatically enable embedding for each dashboard using the API.

Key steps:

1. superset_config.py settings:

   • Set feature flags:

     FEATURE_FLAGS = {
         'DASHBOARD_CROSS_FILTERS': True,
         'EMBEDDABLE_CHARTS': True,
         'EMBEDDED_SUPERSET': True,
     }

   • Enable guest tokens:

     ENABLE_GUEST_TOKEN = True
     GUEST_ROLE_NAME = 'Gamma'  # or your custom read-only role

   • Enable CORS and configure allowed origins:

     ENABLE_CORS = True
     CORS_OPTIONS = {
         'supports_credentials': True,
         'allow_headers': ['*'],
         'resources': {r'/*': {'origins': ['http://localhost:3000']}},
         'origins': ['*', 'http://localhost:8089', 'http://localhost:3000'],
     }

   • Set allowed embedding domains:

     ALLOWED_DOMAINS = ['localhost:3000']
     ALLOWED_EMBEDDING_DOMAINS = ['localhost:3000']

   • (Optional) Disable CSRF for embedding:

     WTF_CSRF_ENABLED = False

   • Configure Content Security Policy for iframe embedding:

     TALISMAN_ENABLED = True
     TALISMAN_CONFIG = {
         "content_security_policy": {
             "frame-ancestors": ["http://localhost:3000"],
         }
     }

   Reference

2. Programmatically enable embedding for a dashboard:
   After your LLM/MCP creates a dashboard, call the Superset API:

   POST /api/v1/dashboard/<id_or_slug>/embedded
   {
     "allowed_domains": ["localhost:3000"]
   }
   

   This sets up the dashboard for embedding without UI steps.
   Reference

3. Guest token authentication:
   Generate a guest token in your backend (using the same secret as Superset) and pass it to your frontend. The frontend uses the Embedded SDK (@superset-ui/embedded-sdk) to render the dashboard in an iframe, authenticating with the guest token.
   Reference

4. Workflow:

   • LLM/MCP creates dashboard via Superset API.
   • Your backend enables embedding for the dashboard via the /embedded API.
   • Backend generates a guest token for the dashboard.
   • Frontend receives the dashboard ID and guest token, then uses the Embedded SDK to render the dashboard.

Security notes:

• Only allow trusted domains in your embedding config.
• Guest tokens should use a read-only role.
• Making dashboards public (no authentication) is possible but not recommended for sensitive data.

Let me know if you want example code for any of these steps!

To reply, just mention @dosu.

---

^{How did I do? Good | Irrelevant | Incorrect | Verbose | Hallucination | Report 🐛 | Other}