实现新的CC

This commit is contained in:
刘祥超
2021-07-19 10:48:53 +08:00
parent 7d8f3a9d9b
commit 3360f2fc08
10 changed files with 164 additions and 5 deletions

View File

@@ -80,6 +80,7 @@ func (this *GroupAction) RunGet(params struct {
"value": rule.Value, "value": rule.Value,
"isCaseInsensitive": rule.IsCaseInsensitive, "isCaseInsensitive": rule.IsCaseInsensitive,
"isComposed": firewallconfigs.CheckCheckpointIsComposed(rule.Prefix()), "isComposed": firewallconfigs.CheckCheckpointIsComposed(rule.Prefix()),
"checkpointOptions": rule.CheckpointOptions,
} }
}), }),
"isOn": set.IsOn, "isOn": set.IsOn,

View File

@@ -81,6 +81,7 @@ func (this *GroupAction) RunGet(params struct {
"value": rule.Value, "value": rule.Value,
"isCaseInsensitive": rule.IsCaseInsensitive, "isCaseInsensitive": rule.IsCaseInsensitive,
"isComposed": firewallconfigs.CheckCheckpointIsComposed(rule.Prefix()), "isComposed": firewallconfigs.CheckCheckpointIsComposed(rule.Prefix()),
"checkpointOptions": rule.CheckpointOptions,
} }
}), }),
"isOn": set.IsOn, "isOn": set.IsOn,

View File

@@ -0,0 +1,24 @@
// 显示WAF规则的标签
Vue.component("http-firewall-rule-label", {
props: ["v-rule"],
data: function () {
return {
rule: this.vRule
}
},
template: `<div>
<div class="ui label tiny basic">
{{rule.name}}[{{rule.param}}]
<!-- cc2 -->
<span v-if="rule.param == '\${cc2}'">
{{rule.checkpointOptions.period}}秒/{{rule.checkpointOptions.threshold}}请求
</span>
<span v-else>
<span v-if="rule.paramFilters != null && rule.paramFilters.length > 0" v-for="paramFilter in rule.paramFilters"> | {{paramFilter.code}}</span>
<var :class="{dash:rule.isCaseInsensitive}" :title="rule.isCaseInsensitive ? '大小写不敏感':''" v-if="!rule.isComposed">{{rule.operator}}</var>
{{rule.value}}
</span>
</div>
</div>`
})

View File

@@ -39,7 +39,16 @@ Vue.component("http-firewall-rules-box", {
<input type="hidden" name="rulesJSON" :value="JSON.stringify(rules)"/> <input type="hidden" name="rulesJSON" :value="JSON.stringify(rules)"/>
<div v-if="rules.length > 0"> <div v-if="rules.length > 0">
<div v-for="(rule, index) in rules" class="ui label small basic" style="margin-bottom: 0.5em"> <div v-for="(rule, index) in rules" class="ui label small basic" style="margin-bottom: 0.5em">
<span>{{rule.param}}<span v-if="rule.paramFilters != null && rule.paramFilters.length > 0" v-for="paramFilter in rule.paramFilters"> | {{paramFilter.code}}</span> <var v-if="rule.value.length > 0">{{rule.operator}}</var> {{rule.value}}</span> {{rule.name}}[{{rule.param}}]
<!-- cc2 -->
<span v-if="rule.param == '\${cc2}'">
{{rule.checkpointOptions.period}}秒/{{rule.checkpointOptions.threshold}}请求
</span>
<span v-else>
<span v-if="rule.paramFilters != null && rule.paramFilters.length > 0" v-for="paramFilter in rule.paramFilters"> | {{paramFilter.code}}</span> <var v-if="rule.value.length > 0">{{rule.operator}}</var> {{rule.value}}
</span>
<a href="" title="修改" @click.prevent="updateRule(index, rule)"><i class="icon pencil small"></i></a> <a href="" title="修改" @click.prevent="updateRule(index, rule)"><i class="icon pencil small"></i></a>
<a href="" title="删除" @click.prevent="removeRule(index)"><i class="icon remove"></i></a> <a href="" title="删除" @click.prevent="removeRule(index)"><i class="icon remove"></i></a>
</div> </div>

View File

@@ -84,3 +84,115 @@ Vue.component("http-cond-general-header-length", {
</table> </table>
</div>` </div>`
}) })
// CC
Vue.component("http-firewall-checkpoint-cc", {
props: ["v-checkpoint"],
data: function () {
let keys = []
let period = 60
let threshold = 1000
let options = {}
if (window.parent.UPDATING_RULE != null) {
options = window.parent.UPDATING_RULE.checkpointOptions
}
if (options == null) {
options = {}
}
if (options.keys != null) {
keys = options.keys
}
if (keys.length == 0) {
keys = ["${remoteAddr}", "${requestPath}"]
}
if (options.period != null) {
period = options.period
}
if (options.threshold != null) {
threshold = options.threshold
}
let that = this
setTimeout(function () {
that.change()
}, 100)
return {
keys: keys,
period: period,
threshold: threshold,
options: {},
value: threshold
}
},
watch: {
period: function () {
this.change()
},
threshold: function () {
this.change()
}
},
methods: {
changeKeys: function (keys) {
this.keys = keys
this.change()
},
change: function () {
let period = parseInt(this.period.toString())
if (isNaN(period) || period <= 0) {
period = 60
}
let threshold = parseInt(this.threshold.toString())
if (isNaN(threshold) || threshold <= 0) {
threshold = 1000
}
this.value = threshold
this.vCheckpoint.options = [
{
code: "keys",
value: this.keys
},
{
code: "period",
value: period,
},
{
code: "threshold",
value: threshold
}
]
}
},
template: `<div>
<input type="hidden" name="operator" value="gte"/>
<input type="hidden" name="value" :value="value"/>
<table class="ui table">
<tr>
<td class="title">统计对象组合 *</td>
<td>
<metric-keys-config-box :v-keys="keys" @change="changeKeys"></metric-keys-config-box>
</td>
</tr>
<tr>
<td>统计周期 *</td>
<td>
<div class="ui input right labeled">
<input type="text" v-model="period" style="width: 6em" maxlength="8"/>
<span class="ui label">秒</span>
</div>
</td>
</tr>
<tr>
<td>阈值 *</td>
<td>
<input type="text" v-model="threshold" style="width: 6em" maxlength="8"/>
</td>
</tr>
</table>
</div>`
})

View File

@@ -16,6 +16,11 @@ Vue.component("metric-keys-config-box", {
keyDefs: window.METRIC_HTTP_KEYS keyDefs: window.METRIC_HTTP_KEYS
} }
}, },
watch: {
keys: function () {
this.$emit("change", this.keys)
}
},
methods: { methods: {
cancel: function () { cancel: function () {
this.key = "" this.key = ""

View File

@@ -34,10 +34,16 @@
<!-- 组合规则的选项 --> <!-- 组合规则的选项 -->
<tbody v-if="checkpoint != null && checkpoint.isComposed"> <tbody v-if="checkpoint != null && checkpoint.isComposed">
<tr>
<td colspan="2">配置选项</td>
</tr>
<tr> <tr>
<td>配置选项</td> <td colspan="2">
<td> <!-- 通用header -->
<http-cond-general-header-length v-if="checkpoint.prefix == 'requestGeneralHeaderLength' || checkpoint.prefix == 'responseGeneralHeaderLength'" :v-checkpoint="checkpoint"></http-cond-general-header-length> <http-cond-general-header-length v-if="checkpoint.prefix == 'requestGeneralHeaderLength' || checkpoint.prefix == 'responseGeneralHeaderLength'" :v-checkpoint="checkpoint"></http-cond-general-header-length>
<!-- CC -->
<http-firewall-checkpoint-cc v-if="checkpoint.prefix == 'cc2'" :v-checkpoint="checkpoint"></http-firewall-checkpoint-cc>
</td> </td>
</tr> </tr>
</tbody> </tbody>

View File

@@ -46,7 +46,7 @@
</td> </td>
<td class="rules-box"> <td class="rules-box">
<div v-for="rule in set.rules" style="margin-top: 0.4em;margin-bottom:0.4em"> <div v-for="rule in set.rules" style="margin-top: 0.4em;margin-bottom:0.4em">
<span class="ui label tiny basic">{{rule.name}}[{{rule.param}}] <span v-if="rule.paramFilters != null && rule.paramFilters.length > 0" v-for="paramFilter in rule.paramFilters"> | {{paramFilter.code}}</span> <var :class="{dash:rule.isCaseInsensitive}" :title="rule.isCaseInsensitive ? '大小写不敏感':''" v-if="!rule.isComposed">{{rule.operator}}</var> {{rule.value}}</span> <http-firewall-rule-label :v-rule="rule"></http-firewall-rule-label>
</div> </div>
<span class="ui disabled" v-if="set.rules.length == 0">暂时还没有规则</span> <span class="ui disabled" v-if="set.rules.length == 0">暂时还没有规则</span>
</td> </td>

View File

@@ -9,6 +9,7 @@
<td class="title">名称<em>Name</em></td> <td class="title">名称<em>Name</em></td>
<td> <td>
<input type="text" name="name" value="" maxlength="200" placeholder="类似于Server、Content-Type之类" ref="focus"/> <input type="text" name="name" value="" maxlength="200" placeholder="类似于Server、Content-Type之类" ref="focus"/>
<p class="comment">请注意名称的大小写如无特殊需求Header名称的格式通常为<code-label>Xxx</code-label>或者<code-label>Xxx-Yyy</code-label></p>
</td> </td>
</tr> </tr>
<tr> <tr>

View File

@@ -48,7 +48,7 @@
</td> </td>
<td class="rules-box"> <td class="rules-box">
<div v-for="rule in set.rules" style="margin-top: 0.4em;margin-bottom:0.4em"> <div v-for="rule in set.rules" style="margin-top: 0.4em;margin-bottom:0.4em">
<span class="ui label tiny basic">{{rule.name}}[{{rule.param}}] <span v-if="rule.paramFilters != null && rule.paramFilters.length > 0" v-for="paramFilter in rule.paramFilters"> | {{paramFilter.code}}</span> <var :class="{dash:rule.isCaseInsensitive}" :title="rule.isCaseInsensitive ? '大小写不敏感':''" v-if="!rule.isComposed">{{rule.operator}}</var> {{rule.value}}</span> <http-firewall-rule-label :v-rule="rule"></http-firewall-rule-label>
</div> </div>
<span class="ui disabled" v-if="set.rules.length == 0">暂时还没有规则</span> <span class="ui disabled" v-if="set.rules.length == 0">暂时还没有规则</span>
</td> </td>