Embed widget In Amazon Grafana

Question

In Amazon Grafana its possible to add HTML panels but its impossible to use external links. I've even tried using links to S3 bucket in AWS. 
I need to embed a widget or use some external js library to display 3d images in my dashboard. However, It seems impossible to use any links in this configuration (Amazon Grafana), I've even tried IFrames or images - and got an error message like

Refused to load the image '' because it violates the following Content Security Policy directive: "img-src 'self' blob: data:    ".
I cant use this solution - https://grafana.com/docs/grafana/latest/setup-grafana/configure-grafana/#allow_embedding because I don't have access to the configuration file. 
Any ideas how I can embed or use externl link to my Dashboard?

Answer

There are a few options to try embedding external content in Amazon Managed Grafana:

You can embed images by encoding them to base64 and including them directly in the text panel. For example:

```
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4888AcwC5ABjCVgBhMPmPAAIAnE8V7WHxYhwAAAAASUVORK5CYII=">
```

Some Grafana plugins allow embedding external content. For example, the Image Panel plugin allows directly linking images. However, this plugin may not be available in Amazon Managed Grafana.

You can create a dashboard link that includes the time range variable, so clicking the link will open the dashboard zoomed to the correct time period.

As a workaround, you may be able to display external content by embedding it in a dashboard linked from within Grafana. However, this depends on the specific security policies configured for your Amazon Managed Grafana instance.

Answer

same happening to me also i have been wating from last 5 days but no responce

Case ID 171446622600648.

Dear AWS Support Team,

I hope this message finds you well. I'm reaching out because I require assistance with enabling embedding and anonymous access for the Amazon Grafana dashboard. My goal is to integrate the live Amazon Grafana dashboard into my local website.

Currently, my AWS setup involves using S3, Athena, and Amazon Grafana. Data is continuously updated from Amazon Grafana to S3, then to Athena, and finally to Grafana.

To enhance user experience and accessibility, I need to embed the Amazon Grafana dashboard into my local website. Additionally, I require anonymous access to ensure seamless viewing for all users without the need for individual authentication.

Could you please assist me with the necessary steps to enable both embedding and anonymous access for the Amazon Grafana dashboard? Any guidance or best practices you can provide would be greatly appreciated.

i have been waiting form last friday for your support is to late every unhappy reagrding your support. i hope you will reslove it as soon as possable

Thank you very much for your support

getting an error like when i try in to display amazom grafana dashboard in local website.

Refused to display 'https:///' in a frame because it set 'X-Frame-Options' to 'deny'. (index):2940 Uncaught TypeError: Cannot read properties of null (reading 'classList') at HTMLDocument.onDocumentLoad ((index):2940:19)

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Amazon Managed Grafana Dashboard</title> </head> <body>  <iframe src="https://" width="450" height="200" frameborder="0"></iframe> </body> </html>

Embed widget In Amazon Grafana

Contenuto pertinente