Embedding charts

[waleedshabbir1]

Hello,

I can see there are workarounds to embed the complete dashboard into the external react website but is there a way we can embed single chart into our blogging react website without exposing data sources and without authentication?

I just want to display chart on a public website.

[waleedshabbir1]

@eschutho I tried that but it still shows authentication page. Any idea how to fix that?

[waleedshabbir1]

anyone?

[zs-err]

Did you find a solution? @waleedshabbir1 I'm researching the same issue.

[eschutho]

@Antonio-RiveroMartnez maybe you might have some insight on this?

[Antonio-RiveroMartnez]

@waleedshabbir1 based on your description about getting redirected to login page and assuming you are not using the embedded-sdk, I believe it's not the chart itself nor the embedded solution but some missing configuration on the public role.

In order to your chart to be publicly accessible you must specify have a public role or use the PUBLIC_ROLE_LIKE in the config, this role must have permissions set so it can properly read the chart and also you must add public role to access the chart.

some permissions you might need are:

can write on ExploreFormDataRestApi,
can read on ExploreFormDataRestApi,

[zs-err]

I am not using embedded SDK because in my production it will not be allowed (i.e. the package will not pass approval for prod).

I'm trying to find best solution on using iframes for both the dashboard and charts. And how to integrate them inside angular application.

I'm trying to find solution how to do authentication in those and I'm not finding some. What I want is 3 things:

1. Access charts without user needing to log in to apache superset. I don't know how to make the chart itself public
2. Use custom authentication for dashboard so that user doesn't need to log in into dashboard if he is already logged in into my site. What I've seen this is not possbile?
3. Can I use the chart API to get the emphasized part of this url localhost:8088/superset/explore/p/vxmXWAx1RA9/?standalone=1&height=400. I want that part (the vxmXWAx1RA9 part) so I can dinamically add/remove embedeed charts without having to rebuild the whole frontend page. But I couldn't find that info on swagger?

IF this is out of scope for this issue I can create a new one or a new discussion

[jean-baka]

OK, but @eschutho kindly note we humbly disagree on your "which isolates the chart content and does not expose any data sources", which is also present in the Preset docs. For instance, if I then get the URL of the iframe itself as XXXX/superset/explore/p/Gpr7VLoz4bn/?standalone=1&height=400, immediately rewritten into XXXX/superset/explore/?form_data_key=CYG3Zfmw7IYHmRXLZppIO-59C3TfOb9L_QWqOpt4jSQsb28UcAJ8nU4_hvJP7DDi&slice_id=628&standalone=1&height=400 showing the same embed standalone in the page, and then trim the tail of the URL by removing the &standalone=1&height=400, you get access to the full underlying dataset and are able to edit the visualization, etc. How is that not "exposing the data source"?

Can't Superset just export to the iframe the necessary data to display the chart, and nothing else?

[apole]

Trying same thing, with iframe. Get redirected back to login page.

http:///superset/dashboard/mydashboard/?standalone=1&edit=false&show_filters=1&access_token=

Tried sending access token derived using api/v1/security/guest_token/

Any input on how to pass the token to iframe?

[waleedshabbir1]

@zs-err did you find any solution for "Access charts without user needing to log in to apache superset. I don't know how to make the chart itself public" ?

[zs-err]

@waleedshabbir1 No I didn't. I was hoping to get an answer on this thread

[zs-err]

@Antonio-RiveroMartnez Can I ask you to take a look at my questions or if you can provide me some source of info? (If you have the time, that is).

All options I find either use embedded SDK or I have to log in inside the iframe.

Is SDK not recommended for production?

[Antonio-RiveroMartnez]

Hey @zs-err I invite you to join our community's slack: https://superset.apache.org/community/ . There is channel exclusively open for embedding superset. Here's the link to one possible solution: https://apache-superset.slack.com/archives/C01EP56QGTS/p1667072833711929

[JollyGood97]

perhaps this might help https://www.tetranyde.com/blog/embedding-superset

[leandroembu]

I wonder why it's so difficult to share a single chart without log in.

[eschutho]

OK, but @eschutho kindly note we humbly disagree on your "which isolates the chart content and does not expose any data sources", which is also present in the Preset docs. For instance, if I then get the URL of the iframe itself as XXXX/superset/explore/p/Gpr7VLoz4bn/?standalone=1&height=400, immediately rewritten into XXXX/superset/explore/?form_data_key=CYG3Zfmw7IYHmRXLZppIO-59C3TfOb9L_QWqOpt4jSQsb28UcAJ8nU4_hvJP7DDi&slice_id=628&standalone=1&height=400 showing the same embed standalone in the page, and then trim the tail of the URL by removing the &standalone=1&height=400, you get access to the full underlying dataset and are able to edit the visualization, etc. How is that not "exposing the data source"?

Can't Superset just export to the iframe the necessary data to display the chart, and nothing else?

I looked into this and found the extra information that you're referring to. Thank you for pointing it out. We are working on removing extra response information from the embedded api that isn't necessary. This should be fixed in one of the upcoming releases. For use cases outside of embedded, this data will still be returned.

[eschutho]

@jfrag1 or @lilykuang, can you help answer this question?

[FadeiKholyavo]

@waleedshabbir1 From official documentation. https://superset.apache.org/docs/security/#public "To allow logged-out users to access some Superset features, you can use the PUBLIC_ROLE_LIKE config setting and assign it to another role whose permissions you want passed to this role.

For example, by setting PUBLIC_ROLE_LIKE = "Gamma" in your superset_config.py file, you grant public role the same set of permissions as for the Gamma role. This is useful if one wants to enable anonymous users to view dashboards. Explicit grant on specific datasets is still required, meaning that you need to edit the Public role and add the public data sources to the role manually."

After you have changed this parameter, run the superset init command.

[frainfreeze]

Hello,

I can see there are workarounds to embed the complete dashboard into the external react website but is there a way we can embed single chart into our blogging react website without exposing data sources and without authentication?

I just want to display chart on a public website.

For this usecase I recommend exporting static image and hosting on cdn, or if you want dynamic data you can export chart data and load on the client in apache echarts. I think this is the best option safety wise. It can be automated using APIs and should be better for caching IMHO.

[rusackas]

Hi all... this thread's been quiet for half a year, and the last two comments provide good suggestions for public embedding and single-chart embedding workarounds, so I'm going to close it out. It's true our single-chart embed isn't part of the Superset Embedded SDK. If someone wants to make contributions to that end, it would be welcomed, but as it stands, anything remaining on this thread seems more like feature requests than bugs, so I'd encourage migrating this to a GitHub Discussion if anyone wants to continue here. Let me know if that's the case.

[hug0b]

Here is a discussion for this feature request: https://github.com/apache/superset/discussions/26051