访问日志列表显示WAF相关信息

2026-04-23 21:35:20 +08:00 · 2022-04-21 16:20:03 +08:00
parent dc74884f2d
commit d0b5c7e707
11 changed files with 460 additions and 34 deletions
--- a/web/public/js/components/common/labels.js
+++ b/web/public/js/components/common/labels.js
@@ -14,6 +14,11 @@ Vue.component("code-label", {
 	template: `<span class="ui label basic tiny" style="padding: 3px;margin-left:2px;margin-right:2px" @click.prevent="click"><slot></slot></span>`
 })

+Vue.component("code-label-plain", {
+	template: `<span class="ui label basic tiny" style="padding: 3px;margin-left:2px;margin-right:2px"><slot></slot></span>`
+})
+
+
 // tiny标签
 Vue.component("tiny-label", {
 	template: `<span class="ui label tiny" style="margin-bottom: 0.5em"><slot></slot></span>`
--- a/web/public/js/components/server/http-access-log-box.js
+++ b/web/public/js/components/server/http-access-log-box.js
@@ -52,9 +52,25 @@ Vue.component("http-access-log-box", {
 		}
 	},
 	template: `<div style="word-break: break-all" :style="{'color': (accessLog.status >= 400) ? '#dc143c' : ''}" ref="box">
-	<a v-if="accessLog.node != null && accessLog.node.nodeCluster != null" :href="'/clusters/cluster/node?nodeId=' + accessLog.node.id + '&clusterId=' + accessLog.node.nodeCluster.id" title="点击查看节点详情" target="_top"><span class="grey">[{{accessLog.node.name}}<span v-if="!accessLog.node.name.endsWith('节点')">节点</span>]</span></a>
-	<a :href="'/servers/server/log?serverId=' + accessLog.serverId" title="点击到网站服务" v-if="vShowServerLink"><span class="grey">[服务]</span></a>
-	<span v-if="accessLog.region != null && accessLog.region.length > 0" class="grey"><ip-box :v-ip="accessLog.remoteAddr">[{{accessLog.region}}]</ip-box></span> <ip-box><keyword :v-word="vKeyword">{{accessLog.remoteAddr}}</keyword></ip-box> [{{accessLog.timeLocal}}] <em>&quot;<keyword :v-word="vKeyword">{{accessLog.requestMethod}}</keyword> {{accessLog.scheme}}://<keyword :v-word="vKeyword">{{accessLog.host}}</keyword><keyword :v-word="vKeyword">{{accessLog.requestURI}}</keyword> <a :href="accessLog.scheme + '://' + accessLog.host + accessLog.requestURI" target="_blank" title="新窗口打开" class="disabled"><i class="external icon tiny"></i> </a> {{accessLog.proto}}&quot; </em> <keyword :v-word="vKeyword">{{accessLog.status}}</keyword> <code-label v-if="accessLog.attrs != null && (accessLog.attrs['cache.status'] == 'HIT' || accessLog.attrs['cache.status'] == 'STALE')">cache {{accessLog.attrs['cache.status'].toLowerCase()}}</code-label> <code-label v-if="accessLog.firewallActions != null && accessLog.firewallActions.length > 0">waf {{accessLog.firewallActions}}</code-label> <span v-if="accessLog.tags != null && accessLog.tags.length > 0">- <code-label v-for="tag in accessLog.tags" :key="tag">{{tag}}</code-label></span> - 耗时:{{formatCost(accessLog.requestTime)}} ms <span v-if="accessLog.humanTime != null && accessLog.humanTime.length > 0" class="grey small">&nbsp; ({{accessLog.humanTime}})</span>
-	&nbsp; <a href="" @click.prevent="showLog" title="查看详情"><i class="icon expand"></i></a>
+	<div>
+		<a v-if="accessLog.node != null && accessLog.node.nodeCluster != null" :href="'/clusters/cluster/node?nodeId=' + accessLog.node.id + '&clusterId=' + accessLog.node.nodeCluster.id" title="点击查看节点详情" target="_top"><span class="grey">[{{accessLog.node.name}}<span v-if="!accessLog.node.name.endsWith('节点')">节点</span>]</span></a>
+		<a :href="'/servers/server/log?serverId=' + accessLog.serverId" title="点击到网站服务" v-if="vShowServerLink"><span class="grey">[服务]</span></a>
+		<span v-if="accessLog.region != null && accessLog.region.length > 0" class="grey"><ip-box :v-ip="accessLog.remoteAddr">[{{accessLog.region}}]</ip-box></span> <ip-box><keyword :v-word="vKeyword">{{accessLog.remoteAddr}}</keyword></ip-box> [{{accessLog.timeLocal}}] <em>&quot;<keyword :v-word="vKeyword">{{accessLog.requestMethod}}</keyword> {{accessLog.scheme}}://<keyword :v-word="vKeyword">{{accessLog.host}}</keyword><keyword :v-word="vKeyword">{{accessLog.requestURI}}</keyword> <a :href="accessLog.scheme + '://' + accessLog.host + accessLog.requestURI" target="_blank" title="新窗口打开" class="disabled"><i class="external icon tiny"></i> </a> {{accessLog.proto}}&quot; </em> <keyword :v-word="vKeyword">{{accessLog.status}}</keyword> <code-label v-if="accessLog.attrs != null && (accessLog.attrs['cache.status'] == 'HIT' || accessLog.attrs['cache.status'] == 'STALE')">cache {{accessLog.attrs['cache.status'].toLowerCase()}}</code-label> <code-label v-if="accessLog.firewallActions != null && accessLog.firewallActions.length > 0">waf {{accessLog.firewallActions}}</code-label> <span v-if="accessLog.tags != null && accessLog.tags.length > 0">- <code-label v-for="tag in accessLog.tags" :key="tag">{{tag}}</code-label></span>
+		
+		<span  v-if="accessLog.wafInfo != null">
+			<a :href="(accessLog.wafInfo.policy.serverId == 0) ? '/servers/components/waf/group?firewallPolicyId=' +  accessLog.firewallPolicyId + '&type=inbound&groupId=' + accessLog.firewallRuleGroupId+ '#set' + accessLog.firewallRuleSetId : '/servers/server/settings/waf/group?serverId=' + accessLog.serverId + '&firewallPolicyId=' + accessLog.firewallPolicyId + '&type=inbound&groupId=' + accessLog.firewallRuleGroupId + '#set' + accessLog.firewallRuleSetId" target="_blank">
+				<code-label-plain>
+					<span class="red">
+						WAF --
+						<span v-if="accessLog.wafInfo.group != null">{{accessLog.wafInfo.group.name}} --</span>
+						<span v-if="accessLog.wafInfo.set != null">{{accessLog.wafInfo.set.name}}</span>
+					</span>
+				</code-label-plain>
+			</a>
+		</span>
+			
+		<span v-if="accessLog.requestTime != null"> - 耗时:{{formatCost(accessLog.requestTime)}} ms </span><span v-if="accessLog.humanTime != null && accessLog.humanTime.length > 0" class="grey small">&nbsp; ({{accessLog.humanTime}})</span>
+		&nbsp; <a href="" @click.prevent="showLog" title="查看详情"><i class="icon expand"></i></a>
+	</div>
 </div>`
 })
--- a/web/public/js/components/server/http-access-log-config-box.js
+++ b/web/public/js/components/server/http-access-log-config-box.js
@@ -54,13 +54,12 @@ Vue.component("http-access-log-config-box", {
 		<prior-checkbox :v-config="accessLog" v-if="vIsLocation || vIsGroup"></prior-checkbox>
 		<tbody v-show="(!vIsLocation && !vIsGroup) || accessLog.isPrior">
 			<tr>
-				<td class="title">是否开启访问日志存储</td>
+				<td class="title">开启访问日志</td>
 				<td>
 					<div class="ui checkbox">
 						<input type="checkbox" v-model="accessLog.isOn"/>
 						<label></label>
 					</div>
-					<p class="comment">关闭访问日志，并不影响统计的运行。</p>
 				</td>
 			</tr>
 		</tbody>
@@ -123,7 +122,7 @@ Vue.component("http-access-log-config-box", {
        <h4>WAF相关</h4>
        <table class="ui table definition selectable">
            <tr>
-                <td class="title">是否只记录WAF相关日志</td>
+                <td class="title">只记录WAF相关日志</td>
                <td>
                    <checkbox v-model="accessLog.firewallOnly"></checkbox>
                    <p class="comment">选中后只记录WAF相关的日志。通过此选项可有效减少访问日志数量，降低网络带宽和存储压力。</p>
--- a/web/views/@default/servers/logs/index.js
+++ b/web/views/@default/servers/logs/index.js
@@ -1,17 +1,22 @@
 Tea.context(function () {
-    this.$delay(function () {
-        let that = this
-        teaweb.datepicker("day-input", function (day) {
-            that.day = day
-        })
-    })
+	this.$delay(function () {
+		let that = this
+		teaweb.datepicker("day-input", function (day) {
+			that.day = day
+		})
+	})

-    let that = this
-    this.accessLogs.forEach(function (accessLog) {
-        if (typeof (that.regions[accessLog.remoteAddr]) == "string") {
-            accessLog.region = that.regions[accessLog.remoteAddr]
-        } else {
-            accessLog.region = ""
-        }
-    })
+	let that = this
+	this.accessLogs.forEach(function (accessLog) {
+		if (typeof (that.regions[accessLog.remoteAddr]) == "string") {
+			accessLog.region = that.regions[accessLog.remoteAddr]
+		} else {
+			accessLog.region = ""
+		}
+		if (accessLog.firewallRuleSetId > 0 && typeof (that.wafInfos[accessLog.firewallRuleSetId]) == "object") {
+			accessLog.wafInfo = that.wafInfos[accessLog.firewallRuleSetId]
+		} else {
+			accessLog.wafInfo = null
+		}
+	})
 })
--- a/web/views/@default/servers/server/log/history.js
+++ b/web/views/@default/servers/server/log/history.js
@@ -13,5 +13,10 @@ Tea.context(function () {
        } else {
            accessLog.region = ""
        }
+		if (accessLog.firewallRuleSetId > 0 && typeof (that.wafInfos[accessLog.firewallRuleSetId]) == "object") {
+			accessLog.wafInfo = that.wafInfos[accessLog.firewallRuleSetId]
+		} else {
+			accessLog.wafInfo = null
+		}
    })
 })
--- a/web/views/@default/servers/server/log/index.js
+++ b/web/views/@default/servers/server/log/index.js
@@ -30,6 +30,11 @@ Tea.context(function () {
 					} else {
 						accessLog.region = ""
 					}
+					if (accessLog.firewallRuleSetId > 0 && typeof (resp.data.wafInfos[accessLog.firewallRuleSetId]) == "object") {
+						accessLog.wafInfo = resp.data.wafInfos[accessLog.firewallRuleSetId]
+					} else {
+						accessLog.wafInfo = null
+					}
 				})

 				let max = 100
--- a/web/views/@default/servers/server/log/today.js
+++ b/web/views/@default/servers/server/log/today.js
@@ -6,5 +6,10 @@ Tea.context(function () {
        } else {
            accessLog.region = ""
        }
+		if (accessLog.firewallRuleSetId > 0 && typeof (that.wafInfos[accessLog.firewallRuleSetId]) == "object") {
+			accessLog.wafInfo = that.wafInfos[accessLog.firewallRuleSetId]
+		} else {
+			accessLog.wafInfo = null
+		}
    })
 })