grafana 地图_把kibana装到grafana里要几步

13663e000958f23c0e5a3541b3b230e9.png

  脚本之家

你与百万开发者在一起

13663e000958f23c0e5a3541b3b230e9.png 58b73b812a983bede0c962cfb5506411.gif

 8e2805609a6e15d04eb2b710a335994a.png   

作者 | 左国才 出品 | 脚本之家(ID:jb51net)

把kibana装到grafana里要几步?

我们想在grafana里给elasticsearch数据源做词云可视化,由于grafana没有词云方面的插件,我们发现kibana里有词云方面的可视化方案tag cloud。我们尝试着把kibana的词云的图形嵌入到grafana里来快速实现了grafana的词云功能。那么把kibana装到grafana里要几步呢?答案是三步。

原理

先来说说服务部署的现状,kibana和elasticsearch 我没有选用官方的x-pack版,选用的AWS 开源的opendistroforelasticsearch,是elasticsearch 官方的修改版,里边集成了AWS的认证模块opendistro_security,在这里我没有启用其他认证方式,只是使用了opendistro_security的简单认证(base auth)。这样就有一个问题,如果在grafana里直接嵌入从kibana面板拷贝过来的iframe code的时候,需要做认证,否则会报401 Unauthorized错误。所以我使用了一种折中的方案,在grafana和kibana中间再加一层nginx代理,把简单认证的密码加到nginx请求的header里,让nginx去帮忙做认证,把认证后的结果返回给grafana。画了个流程图,有点low,大家凑合着看吧。

grafana(html iframe)----------- nginx (header) ------------- kibana(带base auth功能)

如果您对opendistro项目感兴趣,可以参考https://opendistro.github.io/for-elasticsearch/

第一步 配置好kibana

kibana和elasticsearch 配置认证这里就不讲了,感兴趣的可以参考opendistro开源项目文档。

1.在Kibana Visualize 里 创建 tag cloud ,把elasticsearch里的数据可视化为词云。如图1

fb0a7ba916dfb49d31ab8b74cdab0474.png

2.Kibana Visualize里支持分享iframe代码,拷贝词云这幅图表的iframe代码。如图2

1727670c5588f55f13eb999e029d8bda.png

第二步 配置好nginx

对用户名和密码 做base64转码

echo -n username:password | base64

比如用户名是admin,密码是admin,echo -n admin:admin | base64,使用Base64对明文admin:admin进行转码,然后把转码后的base64字符串添加到nginx proxy_set_header Authorization "Basic YWRtaW46YWRtaW4=";中。

nginx.conf example

upstream  kibana_backend  {                 server   10.10.10.110:5601 max_fails=2 fail_timeout=30s ;        }server {        listen 443 ssl;        server_name kibana.xxx.com;        ssl_certificate  xxx.com.crt;        ssl_certificate_key  xxx.com.key;        ssl_session_timeout  5m;        ssl_protocols TLSv1 TLSv1.1 TLSv1.2;             ssl_ciphers  HIGH:!aNULL:!MD5;        ssl_ciphers  ALL:!ADH:!EXPORT56:RC4+RSA:+HIGH:+MEDIUM:+LOW:+SSLv2:+EXP;            ssl_prefer_server_ciphers   on;        location / {        proxy_pass   http://kibana_backend/;        proxy_set_header  Host $host;        proxy_set_header  X-Real-IP $remote_addr;        proxy_set_header  X-Forwarded-For $proxy_add_x_forwarded_for;        proxy_set_header  Authorization "Basic YWRtaW46YWRtaW4=";    }}

第三步 配置好grafana

1.grafana 配置文件

grafana 配置里需要设置允许嵌入iframe

grep -vE "^;|#"  /etc/grafana/grafana.ini[security]allow_embedding = true[panels]disable_sanitize_html = true
2.grafana(html iframe)

在grafana 面板里我们通过Pannel--Visualization--Text--Options--Mode--html 添加iframe代码。可以先拿百度地图测试一下,看html iframe能否正常显示。

    title="Inline Frame Example"    width="1200"    height="900"    src="https://map.baidu.com">

以下嵌入grafana的代码,只对布局做了调整,其他都是引用kibana--Visualize --share里"Copy iframe code" 的内容。

好啦,此刻kiabana的词云已经装到grafana里了,是不是很简单,三步搞定grafana词云。当然你把python的 word cloud嵌入到grafana里,我也没意见。以上kibana,grafana 都使用了域名并配置了https证书。

本文参考的文档 :https://discuss.elastic.co/t/auto-authenticating-to-iframe-embedded-kibana-dashboard/46091

————————————————————

作者简介:左国才,VIPKID运维工程师,笔名icai,主要研究Linux操作系统,数据库,云计算领域相关技术, 热爱开源技术,平时喜欢阅读脚本之家公众号。

- END -点击卡片进入小程序,签到赢礼品??????

e8a26f305431943e79ba07d7af54bed7.png

(更多精彩值得期待……)

bab3b513f7fc8af8a0fed5709e19993c.gif

a77a861285e50b0bc31d732410a1e1d4.gif

● fad2e3e902181d51b62c731286e1f36e.gif 人人都欠微软一个正版?

● fad2e3e902181d51b62c731286e1f36e.gif 脚本之家粉丝福利,请查看!

● fad2e3e902181d51b62c731286e1f36e.gif 30多岁程序员老W,无奈选择转行!问题出在哪

● IT 行业平均工资又夺冠了?

● 高级程序员到底长什么样子?

 那些40岁的程序员都去哪了

● 世界上第一位程序员,竟然是诗人拜伦的女儿9488479d87c7662a8fd8dead251d6def.gif

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值