cssjshtml vue直接調用elasticsearch接口
- 2019 年 10 月 25 日
- 筆記
es query查詢
es同一字段多條件合併查詢:
{ "query":{ "bool":{ "must":{ "bool":{ "must":[ { "match_phrase":{ "message":"request" } }, { "match_phrase":{ "message":this.openid } } ] } } } }, "_source":[ "message", "@timestamp" ] }
axios調用es接口認證解決方法
通過headers中設置:Authorization 來通過驗證,Authorization通過正常登陸頁面後在headers中獲取。此方法犧牲了安全。
JSON.parse(jsonstr):用來解析json字符串,轉為json對象。 json.hasOwnProperty(key):用來判斷json中是否有此key。
axios.post(es_url, es_data, { headers: { 'Authorization': 'Basic ********', 'Content-Type': 'application/json' } } ).then((res) => { res.data.hits.hits.forEach(function (item, index) { let message = JSON.parse(item['_source']['message'].substring(12)) console.log(message) let path = '' let globalticket = '' let body = '' if (message.hasOwnProperty("path")) { path = message['path'] } if (message.hasOwnProperty('url')) { path = message['url'] } if (message.hasOwnProperty('headers')) { globalticket = '*******=' + message['headers']['globalticket'] } if (message.hasOwnProperty('body')) { body = JSON.stringify(message['body']) } messsages.push({ "path": path, "globalticket": globalticket, "body": body, "timestamp": item['_source']['@timestamp'] }) }) })
表格設置:
表格內內嵌跳轉鏈接:
<template slot-scope="scope"> <a :href="'http://'+scope.row.globalticket" target="_blank" class="buttonText">{{scope.row.globalticket.split('=')[1]}}</a> </template>
超長隱藏:
<el-table-column
prop="body"
label="body" :show-overflow-tooltip="true">
<el-table :data="tableData" style="width: 100%"> <el-table-column width="240" sortable prop="timestamp" label="timestamp"> </el-table-column> <el-table-column width="500" prop="path" label="path"> </el-table-column> <el-table-column width="500" prop="globalticket" label="globalticket" :show-overflow-tooltip="true"> <template slot-scope="scope"> <a :href="'http://'+scope.row.globalticket" target="_blank" class="buttonText">{{scope.row.globalticket.split('=')[1]}}</a> </template> </el-table-column> <el-table-column prop="body" label="body" :show-overflow-tooltip="true"> </el-table-column> </el-table>