✊🏿 Black Lives Matter. Please consider donating to Black Girls Code today.
⚡️ Concerned about the grid? Kyle Baranko teaches how to predicting peak loads using XGBoost. Register for the August webinar!

Graphs cannot be displayed "in a frame because it set 'X-Frame-Options' to 'sameorigin'."

Hi,

I just launched a website and pushed a bunch of people to it.

Many of my users are saying they cannot see the plotly charts and are getting the error:

Refused to display ‘https://plot.ly/~DataLlama/30.embed?link=false&modebar=false&link=false’ in a frame because it set ‘X-Frame-Options’ to ‘sameorigin’.

I’ve done some searching but cannot find anything on this. It’s really messing with my launch and this is a pretty time sensitive thing. Can anyone help?!

Thanks!

1 Like

Hi DataLIama,

were you able to solve your issue yet? It’s been a long time but I’m having troubles with it as well. If you haven’t find a solution yet, I’d like to give you of a few ideas and what I’ve tested so far, and maybe you’ll have more success than me :grinning::

  • Download the whole page using beautifulsoup or wget. beautifulsoup only got me text and not the css and everything so it’s not really a solution. I could not figure out what to do with the wget file I got either. With this solution you would also have problems if you’d want to click things inside the iframe.

  • Using your own proxy. I mean redirecting all requests to localhost. That should bypass with sameorigin issue I guess. There is the python library pproxy but I could not figure out how to use it…

  • Somehow embedding your own browser (with chromium or whatever I don’t know) in the div but that seems unrealistic.

  • A similar idea: lauching an automated browser with selenium and a webdriver (e.g. chrome_driver): I have used this a few times at work so if we can figure out how to tell dash to launch/update the webdriver then that would be a good workaround. It would not be in a div but in a pop-up however.

In my case I’m using clickdata from a chart and it selects a website (I actually want to transition from Tableau and this is an important feature). By the way the div is not 100 % height of the parent div. I’m probably going to open a topic about that.

I have the same issue.

I have this issue using django 3.0.9, I have tried to disable middleware

django.middleware.clickjacking.XFrameOptionsMiddleware

I have also tried adding this to settings.py:
X_FRAME_OPTIONS = ‘SAMEORIGIN’

Neither help. I believe my server is not allowing the client to display the iframe. I don’t see why an iframe is necessary. This is simply a table, isn’t it?

Fixed by using plotly_direct as described here:

https://django-plotly-dash.readthedocs.io/en/latest/template_tags.html