我希望在ReactJS应用程序中添加Grafana仪表板，有没有一种嵌入或库可以用来显示Grafana仪表板？
目前，我正在查看grafana/ui，但它没有任何关于如何使用的文档。
将Grafana仪表板嵌入ReactJS应用程序
3
- FEDeveloper
1
您可以按照此处的说明添加面板：- https://grafana.com/docs/grafana/latest/sharing/share-panel/#embed-panel - rohatgisanat
1个回答
3
Grafana提供了一个开箱即用的功能，可以通过HTML iframe元素嵌入面板。虽然仪表盘的共享功能不显示此选项，但可以使用相同的策略通过复制其URL并在iframe中设置来嵌入整个仪表盘。然而，整个Grafana用户界面都会显示出来，包括导航侧边栏，用户可以自由移动，就像他们在Grafana本身中一样（例如切换仪表盘）。
请注意，您可以指定仪表盘应该以“kiosk模式”初始显示，这将隐藏所有界面元素，只留下面板，但它不能阻止用户退出此模式（只需按下Esc键即可）。
然而，为了查看面板或仪表盘，用户首先需要在Grafana中进行身份验证。这可以通过启用匿名身份验证来避免，具体是否可行取决于安全策略。
值得一提的是，如果用户已经通过身份验证（即他们最近访问过Grafana并且会话仍然有效），则面板或仪表盘将立即显示，无需额外的身份验证。
考虑到这一点，绕过此限制的一种可能方法是代理请求到Grafana，并由代理服务器自动对用户进行身份验证。如何实现这一点的示例可以在Fusebit上的一篇文章中找到。
这种方法的优点：
- 需要的工作量较小 - 可以轻松指定时间范围和刷新间隔 限制：
请注意，您可以指定仪表盘应该以“kiosk模式”初始显示，这将隐藏所有界面元素，只留下面板，但它不能阻止用户退出此模式（只需按下Esc键即可）。
然而，为了查看面板或仪表盘，用户首先需要在Grafana中进行身份验证。这可以通过启用匿名身份验证来避免，具体是否可行取决于安全策略。
值得一提的是，如果用户已经通过身份验证（即他们最近访问过Grafana并且会话仍然有效），则面板或仪表盘将立即显示，无需额外的身份验证。
考虑到这一点，绕过此限制的一种可能方法是代理请求到Grafana，并由代理服务器自动对用户进行身份验证。如何实现这一点的示例可以在Fusebit上的一篇文章中找到。
这种方法的优点：
- 需要的工作量较小 - 可以轻松指定时间范围和刷新间隔 限制：
- 需要对用户进行身份验证或启用匿名访问
- 用户可以与Grafana交互，但这会导致糟糕的用户体验
- 对于仪表板，用户可以自由移动，就像在Grafana本身中一样（例如切换仪表板）
- 对于面板，用户可以执行某些操作，但不能执行其他操作（例如，他们可以放大但无法缩小，因为时间范围不可见）
- 默认情况下，不允许Grafana与主机应用程序之间进行任何通信
- Aaron Contreras
网页内容由stack overflow 提供, 点击上面的可以查看英文原文，
原文链接
原文链接