Make sure these boxes are checked before submitting your issue - thank you!

  • [x] I have checked the superset logs for python stacktraces and included it here as text if any
  • [x] I have reproduced the issue with at least the latest released version of superset
  • [x] I have checked the issue tracker for the same issue and I haven't found one similar

When I am trying to embed a dashboard into a webpage using an iframe, I am not able to determine the height of the iframe so that it exactly matches the height of the dashboard to prevent a scrollbar from appearing inside the iframe without cropping it. The dashboard and web page that contains the iframe are NOT on the same domain. And, Chrome doesn't support the "x-frame-options=ALLOW FROM ..."

Am I missing something ? Or, is this a feature request ?

I have also found a workaround but that involves the dashboard sending a cross-domain message upon changing it's height.

I'm not sure if I'm the only one not able to figure this out or no one else is asking this.

Superset version

0.25.6

Expected results

Uncropped dashboard

Actual results

Cropped dashboard

Steps to reproduce

iframe code

javascript code

The 2 errors I get in the console are 1- Invalid 'X-Frame-Options' header encountered when loading 'http://127.0.0.1:8088/superset/dashboard/5/?standalone=true': 'ALLOW-FROM http://127.0.0.1' is not a recognized directive. The header will be ignored.

2- Uncaught DOMException: Blocked a frame with origin "http://127.0.0.1:8000" from accessing a cross-origin frame. at resizeIFrameToFitContent (http://127.0.0.1:8000/scenario/:23:46) at HTMLIFrameElement.onload (http://127.0.0.1:8000/scenario/:11:118) resizeIFrameToFitContent @ (index):23 onload @ (index):11

Comment From: paritoshjchandran

The good thing about this is that we do not have to reinvent the wheel, all we need to do is add a javascript file from an existing library that sends the cross-domain message.

For example - This one It simply needs one .js file to be placed in the dashboard HTML which sends the message.

Comment From: paritoshjchandran

Never mind, I have figured it out... If anyone else needs help with this, drop me a message...

Comment From: ajgil

Have you modified HTTP_HEADERS on Superset config.py? 

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

Comment From: paritoshjchandran

@ajgil Since it is based on Flask, I edited the dashboard template to include code that sends a cross domain message which contains the size of the page whenever the size of the page is changed... That way, even the frame stays relatively secure... I hope this helps...

Comment From: joseph-luketelo

I have a question that might be out of topic,

How do I render a dashboard into an iframe while avoiding the need to login to superset? I cannot use public dashboards here, so all my dashboards are private. I need iframes which are somehow "pre-logged into" the relevant user

Comment From: pallaviMN

@paritoshjchandran , Request you to provide full solution on this issue, we too tried to embed super set demo dashboard in one of our client app, and superset demo is having a scroll 1) Whether IframeResizer file need to be placed under which directory i.e iframeResizer.contentWindow.min or iframeResizer.min and where the reference of this file should be embedded 2) In which file "