How to embed an Apache Superset dashboard in a webpage?

user_10922904 0
Viewed 15820

I am trying to implement the Apache superset dashboard in a webpage. Anyone have any idea how to implement this?

apache-superset
3 Answers

Keep the iframe tag line as you mentioned.

<iframe src="linkToYourDashBoard?standalone=true"></iframe>

and check the superset_config.py file.

HTTP_HEADERS = {'X-Frame-Options': 'SAMEORIGIN'}

Change the line to

HTTP_HEADERS = {'X-Frame-Options': 'ALLOWALL'}

or

HTTP_HEADERS = {}

Don't forget to add superset_config.py file to your python path.

user_38054590

First, you need to update the public roles with these options.

  • Security/List Roles:
  • can explore json on Superset,
  • can dashboard on Superset,
  • all database access on all_database_access

Second, embed your dashboard in your HTML

<iframe src="localhost:8088/superset/dashboard/5/?standalone=true"></iframe>
user_29875760

Superset now provides the Superset Embedded SDK, an NPM package for inserting an iframe that will embed your Superset dashboard. I'm using it at the moment and it is relatively straightforward; this is the current implementation example provided in the docs:

import { embedDashboard } from "@superset-ui/embedded-sdk";

embedDashboard({
  id: "abc123", // given by the Superset embedding UI
  supersetDomain: "https://superset.example.com",
  mountPoint: document.getElementById("my-superset-container"), // any html element that can contain an iframe
  fetchGuestToken: () => fetchGuestTokenFromBackend(),
  dashboardUiConfig: { hideTitle: true }, // dashboard UI config: hideTitle, hideTab, hideChartControls (optional)
});

Obviously the end result could still be achieved by adding the iframe "manually," but using the official abstraction might provide simplicity and future functionality in subsequent versions.

user_68313410
Related