Iframe is not embedding in Grafana using Text panel

Grafana
1

I need to embed an iframe using a .html link in Grafana dashboard using Text panel.
I have also done below configurations in grafana.ini

allow_embedding = true
disable_sanitize_html = true

<iframe src="http://your.external.web.page.html"></iframe>

I am running Grafana on my local using docker.

Thanks in advance!

2

did you restart grafana after making the ini changes?

3

yes, actually I am able to see when I using an img tag with .jpeg but it is not working when i am using an iframe with .html link.

4 
page - iframe - status

http - http  - allowed
http - https - allowed
https- http  - not allowed
https- https - allowed
5

sorry but what exactly do you mean by the above comment?

6

if you site is http it will allow http iframe, if http it will allow https iframe etc.

Check that your config is one of the allowed options

7

can you please let me know in configuration which field I should look for ?

8

do you access grafana locally using http or https?

9

using http (localhost:3000)

10

can you check your browser console for errors when the iframe loads?

11

it is coming as a plain text.

12

Just wanted to state i was able to reproduce this issue, with both http and https endpoints using a generic iframe element.
Let me do some digging and see if this is natively possible or if we might need to use a plugin. i feel like it used to work for some reason

image
image1728×506 19.2 KB

13

That’s because you didn’t disable html sanitization = dangerous html tags won’t be implemented as html, but as a string only.

Grafana config has sections, so those configs options must be in the right sections, not in random place.

Page, which you are embedding may reject embedding (there are special headers, which are interpreted by browser, so browser will know that page owner didn’t allow embedding):

14

Ahhh you are right! its been a long time since ive wanted/needed to embed anything into grafana, forgot all about that setting around html sanitization. OP that should 100% solve youre issue as i just tested on my test instance and it worked appropriately

16

so I need to understand do I need to update the page which I am embedding in grafana with this Content-Security-Policy to frame-ancestors or it can be done in grafana configurations file.

17

No, page must allow own embedding in own config,…

For example you want to have your grafana in some iframe: you neee to allow emebeding in grafana config - that will configure all headers, so browser will not reject embedding.

But you can’t allow embedding of any other sites in grafana config. E. g. google.com may have headers, which reject embedding and you can’t configure Grafana to override that. That will be security issue.

18

ok. so what I understood is as per my requirement I need to embed a iframe in Grafana, so I need to allow embedding that external page and add a meta configuration like

<meta http-equiv="Content-Security-Policy" content="frame-ancestors 'self' ">

and then I can embed this page in grafana without any issues right ?

19

Just try, test it and improvement it until you have desired result.
There is many variables which may affect it. You mentioned only CSP, but there can be also headers, which may block it.
How can someone tell you if it will be working, when we don’t know which site/page you are embedding, which headers are there, how csp is configured, which browsers you have, how auth is configured there,
…?

1 Like