腳本之家
你與百萬開發者在一起
作者 | 左國才 出品 | 腳本之家(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
2.Kibana Visualize裡支援分享iframe代碼，拷貝詞雲這幅圖表的iframe代碼。如圖2
第二步 配置好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作業系統，資料庫，雲計算領域相關技術, 熱愛開源技術，平時喜歡閱讀腳本之家公衆号。
grafana 地圖_把kibana裝到grafana裡要幾步把kibana裝到grafana裡要幾步？原理第一步 配置好kibana第二步 配置好nginx第三步 配置好grafana (更多精彩值得期待……)
grafana 地圖_把kibana裝到grafana裡要幾步把kibana裝到grafana裡要幾步？原理第一步 配置好kibana第二步 配置好nginx第三步 配置好grafana
●
人人都欠微軟一個正版？
●
腳本之家粉絲福利，請檢視！
●
30多歲程式員老W，無奈選擇轉行！問題出在哪
● IT 行業平均工資又奪冠了？
● 進階程式員到底長什麼樣子？
● 那些40歲的程式員都去哪了
● 世界上第一位程式員，竟然是詩人拜倫的女兒