Embed (iframe) v2.12 PMM panels

[Sean225]

I am trying to get some panels to embed in a htm page hosted on another server. I am using the docker version 2.12 and have already changed the setting to allow embed (allow_embedding: true).

The panel just shows up as “192.168.2.110 refused to connect”. It is first seeing this error that lead me to the settings change to allow embedding in Grafana.

[Vadim_Yalovets]

Hi Sean,

I could find only one way to make iframe works. It’s disabling authentication for dashboards viewing.

[ademidoff]

Hi @Sean225 ,

could you post your html code from <b>Panel->Share-> Embed</b>?

Also, did you restart grafana (or PMM) after applying the changes to grafana.ini?

[Sean225]

These are the current settings on the server;

#################################### Anonymous Auth ######################

[auth.anonymous]

enable anonymous access

enabled = true

cookie_secure = true

cookie_samesite = none

allow_embedding = true

Within the iframe:

src="https://192.168.2.110/graph/d-solo/node-memory/memory-details?orgId=1&from=1608614356260&to=1608657556260&refresh=1m&

var-interval=$__auto_interval_interval&

var-node_name=db1&var-service_name=All&

var-environment=All&

var-cluster=All&

var-replication_set=All&

var-database=All&

var-node_type=All&

var-service_type=All&

var-username=All&

var-schema=All&panelId=78" width=“450” height=“200” frameborder=“0”>

The webserver that hosts the test.htm page is Apache and SSL, and PMM is running with SSL. From CLI on a random server I can use “curl -k …” and the panel will load the page (though obviously unviewable). The site that hosts the HTML pages is HTTPS only, so the embed links thus have to be as well.

[Sean225]

BTW, I have been editing /etc/grafana/grafana.ini and within PMM>Admin>Settings it is listed as allowing embed. Which would make me think I am editing the correct ini file. However within Chrome’s dev tools I see this:

Refused to display … in a frame because it set ‘X-Frame-Options’ to ‘deny’

Which leads me to think that something else is still blocking or not allowing the panels to be embedded. Also I just want to mention the host server contains a collection of web pages that are embedding to other HTTPS servers.

[ademidoff]

If you can successfully curl the panel from outside PMM, then the problem must be elsewhere. Maybe your apache config or something…

I wonder whether you can curl the panel from the the very Apache server?

[Vadim_Yalovets]

The header is added by nginx for security reasons.

You could use chrome extension “iFrame Allow”

or allow the header in nginx configuration file

[Sean225]

I found the problem, it had nothing to do with Grafana, but within NGINX. In the config file pmm-ssl.conf it had the line “add_header X-Frame-Options DENY;”. I was looking at the wrong source.

For anyone else looking to embed panel within HTTPS site, here is your answer. Besides settings within Grafana.ini you need to set in /etc/nginx/conf.d/pmm-ssl.conf the X-Frame settings