mirror of
https://github.com/TeaOSLab/EdgeAdmin.git
synced 2025-11-13 20:00:25 +08:00
实现缓存策略部分管理功能
This commit is contained in:
刘祥超
50
web/public/js/components/server/http-cache-cond-box.js
Normal file
50
web/public/js/components/server/http-cache-cond-box.js
Normal file
@@ -0,0 +1,50 @@
|
||||
Vue.component("http-cache-cond-box", {
|
||||
template: `<div>
|
||||
<table class="ui table definition selectable">
|
||||
<tr>
|
||||
<td>匹配条件</td>
|
||||
<td><http-request-conds-box></http-request-conds-box></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>缓存有效期</td>
|
||||
<td>
|
||||
<time-duration-box :name="'lifeJSON'" :v-count="3600" :v-unit="'second'"></time-duration-box>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>状态码列表</td>
|
||||
<td>
|
||||
<values-box name="statusList" size="3" maxlength="3" :values="['200']"></values-box>
|
||||
<p class="comment">允许缓存的HTTP状态码列表。</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>跳过的Cache-Control值</td>
|
||||
<td>
|
||||
<values-box name="skipResponseCacheControlValues" size="10" maxlength="100" :values="['private', 'no-cache', 'no-store']"></values-box>
|
||||
<p class="comment">当响应的Cache-Control为这些值时不缓存响应内容，而且不区分大小写。</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>跳过Set-Cookie</td>
|
||||
<td>
|
||||
<div class="ui checkbox">
|
||||
<input type="checkbox" name="skipResponseSetCookie" value="1" checked="checked"/>
|
||||
<label></label>
|
||||
</div>
|
||||
<p class="comment">选中后，当响应的Header中有Set-Cookie时不缓存响应内容。</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>支持请求no-cache刷新</td>
|
||||
<td>
|
||||
<div class="ui checkbox">
|
||||
<input type="checkbox" name="enableRequestCachePragma" value="1"/>
|
||||
<label></label>
|
||||
</div>
|
||||
<p class="comment">选中后，当请求的Header中含有Pragma: no-cache或Cache-Control: no-cache时，会跳过缓存直接读取源内容。</p>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>`
|
||||
})
|
||||
@@ -68,8 +68,13 @@ Vue.component("http-gzip-box", {
|
||||
<p class="comment">0表示不限制，内容长度从文件尺寸或Content-Length中获取。</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>匹配条件</td>
|
||||
<td>
|
||||
<http-request-conds-box :v-conds="gzip.conds"></http-request-conds-box>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<http-request-conds-tbody v-show="isOn() && advancedVisible" :v-conds="gzip.conds"></http-request-conds-tbody>
|
||||
</table>
|
||||
</div>`
|
||||
})
|
||||
82
web/public/js/components/server/http-request-conds-box.js
Normal file
82
web/public/js/components/server/http-request-conds-box.js
Normal file
@@ -0,0 +1,82 @@
|
||||
Vue.component("http-request-conds-box", {
|
||||
props: ["v-conds"],
|
||||
data: function () {
|
||||
let conds = this.vConds
|
||||
if (conds == null) {
|
||||
conds = {
|
||||
isOn: true,
|
||||
connector: "or",
|
||||
groups: []
|
||||
}
|
||||
}
|
||||
return {
|
||||
conds: conds,
|
||||
components: window.REQUEST_COND_COMPONENTS
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
addGroup: function () {
|
||||
let that = this
|
||||
teaweb.popup("/servers/server/settings/conds/addGroupPopup", {
|
||||
height: "30em",
|
||||
callback: function (resp) {
|
||||
that.conds.groups.push(resp.data.group)
|
||||
}
|
||||
})
|
||||
},
|
||||
updateGroup: function (groupIndex, group) {
|
||||
window.UPDATING_COND_GROUP = group
|
||||
let that = this
|
||||
teaweb.popup("/servers/server/settings/conds/addGroupPopup", {
|
||||
height: "30em",
|
||||
callback: function (resp) {
|
||||
Vue.set(that.conds.groups, groupIndex, resp.data.group)
|
||||
}
|
||||
})
|
||||
},
|
||||
removeGroup: function (groupIndex) {
|
||||
let that = this
|
||||
teaweb.confirm("确定要删除这一组条件吗？", function () {
|
||||
that.conds.groups.$remove(groupIndex)
|
||||
})
|
||||
},
|
||||
typeName: function (cond) {
|
||||
let c = this.components.$find(function (k, v) {
|
||||
return v.type == cond.type
|
||||
})
|
||||
if (c != null) {
|
||||
return c.name;
|
||||
}
|
||||
return cond.param + " " + cond.operator
|
||||
}
|
||||
},
|
||||
template: `<div>
|
||||
<input type="hidden" name="condsJSON" :value="JSON.stringify(conds)"/>
|
||||
<div v-if="conds.groups.length > 0">
|
||||
<table class="ui table">
|
||||
<tr v-for="(group, groupIndex) in conds.groups">
|
||||
<td style="background: white">
|
||||
<var v-for="(cond, index) in group.conds" style="font-style: normal;display: inline-block; margin-bottom:0.5em">
|
||||
<span class="ui label tiny">
|
||||
<var v-if="cond.type.length == 0" style="font-style: normal">{{cond.param}} <var>{{cond.operator}}</var></var>
|
||||
<var v-if="cond.type.length > 0" style="font-style: normal">{{typeName(cond)}}: </var>
|
||||
{{cond.value}}
|
||||
</span>
|
||||
|
||||
<var v-if="index < group.conds.length - 1"> {{group.connector}} </var>
|
||||
</var>
|
||||
</td>
|
||||
<td style="width: 5em; background: white">
|
||||
<a href="" title="修改" @click.prevent="updateGroup(groupIndex, group)"><i class="icon pencil small"></i></a> <a href="" title="删除" @click.prevent="removeGroup(groupIndex)"><i class="icon remove"></i></a>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<div class="ui divider"></div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<button class="ui button tiny" type="button" @click.prevent="addGroup()">+</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>`
|
||||
})
|
||||
@@ -1,87 +0,0 @@
|
||||
Vue.component("http-request-conds-tbody", {
|
||||
props: ["v-conds"],
|
||||
data: function () {
|
||||
let conds = this.vConds
|
||||
if (conds == null) {
|
||||
conds = {
|
||||
isOn: true,
|
||||
connector: "or",
|
||||
groups: []
|
||||
}
|
||||
}
|
||||
return {
|
||||
conds: conds,
|
||||
components: window.REQUEST_COND_COMPONENTS
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
addGroup: function () {
|
||||
let that = this
|
||||
teaweb.popup("/servers/server/settings/conds/addGroupPopup", {
|
||||
height: "30em",
|
||||
callback: function (resp) {
|
||||
that.conds.groups.push(resp.data.group)
|
||||
}
|
||||
})
|
||||
},
|
||||
updateGroup: function (groupIndex, group) {
|
||||
window.UPDATING_COND_GROUP = group
|
||||
let that = this
|
||||
teaweb.popup("/servers/server/settings/conds/addGroupPopup", {
|
||||
height: "30em",
|
||||
callback: function (resp) {
|
||||
Vue.set(that.conds.groups, groupIndex, resp.data.group)
|
||||
}
|
||||
})
|
||||
},
|
||||
removeGroup: function (groupIndex) {
|
||||
let that = this
|
||||
teaweb.confirm("确定要删除这一组条件吗？", function () {
|
||||
that.conds.groups.$remove(groupIndex)
|
||||
})
|
||||
},
|
||||
typeName: function (cond) {
|
||||
let c = this.components.$find(function (k, v) {
|
||||
return v.type == cond.type
|
||||
})
|
||||
if (c != null) {
|
||||
return c.name;
|
||||
}
|
||||
return cond.param + " " + cond.operator
|
||||
}
|
||||
},
|
||||
template: `<tbody>
|
||||
<tr>
|
||||
<td>匹配条件</td>
|
||||
<td>
|
||||
<input type="hidden" name="condsJSON" :value="JSON.stringify(conds)"/>
|
||||
<div class="margin"></div>
|
||||
<div v-if="conds.groups.length > 0">
|
||||
<table class="ui table">
|
||||
<tr v-for="(group, groupIndex) in conds.groups">
|
||||
<td style="background: white">
|
||||
<var v-for="(cond, index) in group.conds" style="font-style: normal;display: inline-block; margin-bottom:0.5em">
|
||||
<span class="ui label tiny">
|
||||
<var v-if="cond.type.length == 0" style="font-style: normal">{{cond.param}} <var>{{cond.operator}}</var></var>
|
||||
<var v-if="cond.type.length > 0" style="font-style: normal">{{typeName(cond)}}: </var>
|
||||
{{cond.value}}
|
||||
</span>
|
||||
|
||||
<var v-if="index < group.conds.length - 1"> {{group.connector}} </var>
|
||||
</var>
|
||||
</td>
|
||||
<td style="width: 5em; background: white">
|
||||
<a href="" title="修改" @click.prevent="updateGroup(groupIndex, group)"><i class="icon pencil small"></i></a> <a href="" title="删除" @click.prevent="removeGroup(groupIndex)"><i class="icon remove"></i></a>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<div class="ui divider"></div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<button class="ui button tiny" type="button" @click.prevent="addGroup()">+</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>`
|
||||
})
|
||||
Reference in New Issue
Block a user