支持自动转换图像文件为WebP

internal/web/actions/default/servers/server/settings/locations/locationutils/location_helper.go

@@ -150,6 +150,12 @@ func (this *LocationHelper) createMenus(serverIdString string, locationIdString
 		"isActive": secondMenuItem == "websocket",
 		"isOn":     locationConfig != nil && locationConfig.Web != nil && locationConfig.Web.WebsocketRef != nil && locationConfig.Web.WebsocketRef.IsPrior,
 	})
+	menuItems = append(menuItems, maps.Map{
+		"name":     "WebP",
+		"url":      "/servers/server/settings/locations/webp?serverId=" + serverIdString + "&locationId=" + locationIdString,
+		"isActive": secondMenuItem == "webp",
+		"isOn":     locationConfig != nil && locationConfig.Web != nil && locationConfig.Web.WebP != nil && locationConfig.Web.WebP.IsPrior,
+	})
 	menuItems = append(menuItems, maps.Map{
 		"name":     "Fastcgi",
 		"url":      "/servers/server/settings/locations/fastcgi?serverId=" + serverIdString + "&locationId=" + locationIdString,

internal/web/actions/default/servers/server/settings/locations/webp/index.go

@@ -0,0 +1,60 @@
+// Copyright 2021 Liuxiangchao iwind.liu@gmail.com. All rights reserved.
+
+package webp
+
+import (
+	"encoding/json"
+	"github.com/TeaOSLab/EdgeAdmin/internal/web/actions/actionutils"
+	"github.com/TeaOSLab/EdgeCommon/pkg/rpc/dao"
+	"github.com/TeaOSLab/EdgeCommon/pkg/rpc/pb"
+	"github.com/TeaOSLab/EdgeCommon/pkg/serverconfigs"
+	"github.com/iwind/TeaGo/actions"
+)
+
+type IndexAction struct {
+	actionutils.ParentAction
+}
+
+func (this *IndexAction) Init() {
+
+}
+
+func (this *IndexAction) RunGet(params struct {
+	LocationId int64
+}) {
+	webConfig, err := dao.SharedHTTPWebDAO.FindWebConfigWithLocationId(this.AdminContext(), params.LocationId)
+	if err != nil {
+		this.ErrorPage(err)
+		return
+	}
+
+	this.Data["webId"] = webConfig.Id
+	this.Data["webpConfig"] = webConfig.WebP
+
+	this.Show()
+}
+
+func (this *IndexAction) RunPost(params struct {
+	WebId    int64
+	WebpJSON []byte
+
+	Must *actions.Must
+	CSRF *actionutils.CSRF
+}) {
+	var webpConfig = &serverconfigs.WebPImageConfig{}
+	err := json.Unmarshal(params.WebpJSON, webpConfig)
+	if err != nil {
+		this.Fail("参数校验失败：" + err.Error())
+	}
+
+	_, err = this.RPC().HTTPWebRPC().UpdateHTTPWebWebP(this.AdminContext(), &pb.UpdateHTTPWebWebPRequest{
+		WebId:    params.WebId,
+		WebpJSON: params.WebpJSON,
+	})
+	if err != nil {
+		this.ErrorPage(err)
+		return
+	}
+
+	this.Success()
+}

internal/web/actions/default/servers/server/settings/locations/webp/init.go

@@ -0,0 +1,22 @@
+package webp
+
+import (
+	"github.com/TeaOSLab/EdgeAdmin/internal/configloaders"
+	"github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/servers/server/settings/locations/locationutils"
+	"github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/servers/serverutils"
+	"github.com/TeaOSLab/EdgeAdmin/internal/web/helpers"
+	"github.com/iwind/TeaGo"
+)
+
+func init() {
+	TeaGo.BeforeStart(func(server *TeaGo.Server) {
+		server.
+			Helper(helpers.NewUserMustAuth(configloaders.AdminModuleCodeServer)).
+			Helper(locationutils.NewLocationHelper()).
+			Helper(serverutils.NewServerHelper()).
+			Data("tinyMenuItem", "webp").
+			Prefix("/servers/server/settings/locations/webp").
+			GetPost("", new(IndexAction)).
+			EndAll()
+	})
+}

internal/web/actions/default/servers/server/settings/webp/index.go

@@ -0,0 +1,61 @@
+// Copyright 2021 Liuxiangchao iwind.liu@gmail.com. All rights reserved.
+
+package webp
+
+import (
+	"encoding/json"
+	"github.com/TeaOSLab/EdgeAdmin/internal/web/actions/actionutils"
+	"github.com/TeaOSLab/EdgeCommon/pkg/rpc/dao"
+	"github.com/TeaOSLab/EdgeCommon/pkg/rpc/pb"
+	"github.com/TeaOSLab/EdgeCommon/pkg/serverconfigs"
+	"github.com/iwind/TeaGo/actions"
+)
+
+type IndexAction struct {
+	actionutils.ParentAction
+}
+
+func (this *IndexAction) Init() {
+	this.Nav("", "setting", "index")
+	this.SecondMenu("webp")
+}
+
+func (this *IndexAction) RunGet(params struct {
+	ServerId int64
+}) {
+	webConfig, err := dao.SharedHTTPWebDAO.FindWebConfigWithServerId(this.AdminContext(), params.ServerId)
+	if err != nil {
+		this.ErrorPage(err)
+		return
+	}
+
+	this.Data["webId"] = webConfig.Id
+	this.Data["webpConfig"] = webConfig.WebP
+
+	this.Show()
+}
+
+func (this *IndexAction) RunPost(params struct {
+	WebId    int64
+	WebpJSON []byte
+
+	Must *actions.Must
+	CSRF *actionutils.CSRF
+}) {
+	var webpConfig = &serverconfigs.WebPImageConfig{}
+	err := json.Unmarshal(params.WebpJSON, webpConfig)
+	if err != nil {
+		this.Fail("参数校验失败：" + err.Error())
+	}
+
+	_, err = this.RPC().HTTPWebRPC().UpdateHTTPWebWebP(this.AdminContext(), &pb.UpdateHTTPWebWebPRequest{
+		WebId:    params.WebId,
+		WebpJSON: params.WebpJSON,
+	})
+	if err != nil {
+		this.ErrorPage(err)
+		return
+	}
+
+	this.Success()
+}

internal/web/actions/default/servers/server/settings/webp/init.go

@@ -0,0 +1,19 @@
+package webp
+
+import (
+	"github.com/TeaOSLab/EdgeAdmin/internal/configloaders"
+	"github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/servers/serverutils"
+	"github.com/TeaOSLab/EdgeAdmin/internal/web/helpers"
+	"github.com/iwind/TeaGo"
+)
+
+func init() {
+	TeaGo.BeforeStart(func(server *TeaGo.Server) {
+		server.
+			Helper(helpers.NewUserMustAuth(configloaders.AdminModuleCodeServer)).
+			Helper(serverutils.NewServerHelper()).
+			Prefix("/servers/server/settings/webp").
+			GetPost("", new(IndexAction)).
+			EndAll()
+	})
+}

internal/web/actions/default/servers/serverutils/server_helper.go

@@ -322,6 +322,12 @@ func (this *ServerHelper) createSettingsMenu(secondMenuItem string, serverIdStri
 			"isActive": secondMenuItem == "websocket",
 			"isOn":     serverConfig.Web != nil && serverConfig.Web.WebsocketRef != nil && serverConfig.Web.WebsocketRef.IsOn,
 		})
+		menuItems = append(menuItems, maps.Map{
+			"name":     "WebP",
+			"url":      "/servers/server/settings/webp?serverId=" + serverIdString,
+			"isActive": secondMenuItem == "webp",
+			"isOn":     serverConfig.Web != nil && serverConfig.Web.WebP != nil && serverConfig.Web.WebP.IsOn,
+		})
 		menuItems = append(menuItems, maps.Map{
 			"name":     "Fastcgi",
 			"url":      "/servers/server/settings/fastcgi?serverId=" + serverIdString,

internal/web/import.go

@@ -82,6 +82,7 @@ import (
 	_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/servers/server/settings/locations/stat"
 	_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/servers/server/settings/locations/waf"
 	_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/servers/server/settings/locations/web"
+	_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/servers/server/settings/locations/webp"
 	_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/servers/server/settings/locations/websocket"
 	_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/servers/server/settings/origins"
 	_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/servers/server/settings/pages"
@@ -96,6 +97,7 @@ import (
 	_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/servers/server/settings/unix"
 	_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/servers/server/settings/waf"
 	_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/servers/server/settings/web"
+	_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/servers/server/settings/webp"
 	_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/servers/server/settings/websocket"
 	_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/servers/server/stat"
 

web/public/js/components/common/values-box.js

@@ -66,11 +66,11 @@ Vue.component("values-box", {
 		}
 	},
 	template: `<div>
-	<div v-show="!isEditing">
+	<div v-show="!isEditing && vValues.length > 0">
 		<div class="ui label tiny basic" v-for="(value, index) in vValues" style="margin-top:0.4em;margin-bottom:0.4em">{{value}}</div>
 		<a href="" @click.prevent="startEditing" style="font-size: 0.8em; margin-left: 0.2em">[修改]</a>
 	</div>
-	<div v-show="isEditing">
+	<div v-show="isEditing || vValues.length == 0">
 		<div style="margin-bottom: 1em" v-if="vValues.length > 0">
 			<div class="ui label tiny basic" v-for="(value, index) in vValues" style="margin-top:0.4em;margin-bottom:0.4em">{{value}}
 				<input type="hidden" :name="name" :value="value"/>
@@ -79,7 +79,7 @@ Vue.component("values-box", {
 			</div> 
 			<div class="ui divider"></div>
 		</div> 
-		<!-- 添加|修改 -->\
+		<!-- 添加|修改 -->
 		<div v-if="isAdding || isUpdating">
 			<div class="ui fields inline">
 				<div class="ui field">

web/public/js/components/server/http-webp-config-box.js

@@ -0,0 +1,133 @@
+Vue.component("http-webp-config-box", {
+	props: ["v-webp-config", "v-is-location"],
+	data: function () {
+		let config = this.vWebpConfig
+		if (config == null) {
+			config = {
+				isPrior: false,
+				isOn: false,
+				quality: 50,
+				minLength: {count: 0, "unit": "kb"},
+				maxLength: {count: 0, "unit": "kb"},
+				mimeTypes: ["image/*"],
+				extensions: [".png", ".jpeg", ".jpg"],
+				conds: null
+			}
+		}
+
+		if (config.mimeTypes == null) {
+			config.mimeTypes = []
+		}
+		if (config.extensions == null) {
+			config.extensions = []
+		}
+
+		return {
+			config: config,
+			moreOptionsVisible: false,
+			quality: config.quality
+		}
+	},
+	watch: {
+		quality: function (v) {
+			let quality = parseInt(v)
+			if (isNaN(quality)) {
+				quality = 90
+			} else if (quality < 1) {
+				quality = 1
+			} else if (quality > 100) {
+				quality = 100
+			}
+			this.config.quality = quality
+		}
+	},
+	methods: {
+		isOn: function () {
+			return (!this.vIsLocation || this.config.isPrior) && this.config.isOn
+		},
+		changeExtensions: function (values) {
+			values.forEach(function (v, k) {
+				if (v.length > 0 && v[0] != ".") {
+					values[k] = "." + v
+				}
+			})
+			this.config.extensions = values
+		},
+		changeMimeTypes: function (values) {
+			this.config.mimeTypes = values
+		},
+		changeAdvancedVisible: function () {
+			this.moreOptionsVisible = !this.moreOptionsVisible
+		},
+		changeConds: function (conds) {
+			this.config.conds = conds
+		}
+	},
+	template: `<div>
+	<input type="hidden" name="webpJSON" :value="JSON.stringify(config)"/>
+	<table class="ui table definition selectable">
+		<prior-checkbox :v-config="config" v-if="vIsLocation"></prior-checkbox>
+		<tbody v-show="!vIsLocation || config.isPrior">
+			<tr>
+				<td class="title">是否启用</td>
+				<td>
+					<div class="ui checkbox">
+						<input type="checkbox" value="1" v-model="config.isOn"/>
+						<label></label>
+					</div>
+				</td>
+			</tr>
+		</tbody>
+		<tbody v-show="isOn()">
+			<tr>
+				<td>图片质量</td>
+				<td>
+					<div class="ui input right labeled">
+						<input type="text" v-model="quality" style="width: 5em" maxlength="4"/>
+						<span class="ui label">%</span>
+					</div>
+					<p class="comment">取值在0到100之间，数值越大生成的图像越清晰，同时文件尺寸也会越大。</p>
+				</td>
+			</tr>
+			<tr>
+				<td>支持的扩展名</td>
+				<td>
+					<values-box :values="config.extensions" @change="changeExtensions" placeholder="比如 .html"></values-box>
+					<p class="comment">含有这些扩展名的URL将会被转成WebP，不区分大小写。</p>
+				</td>
+			</tr>
+			<tr>
+				<td>支持的MimeType</td>
+				<td>
+					<values-box :values="config.mimeTypes" @change="changeMimeTypes" placeholder="比如 text/*"></values-box>
+					<p class="comment">响应的Content-Type里包含这些MimeType的内容将会被转成WebP。</p>
+				</td>
+			</tr>
+		</tbody>
+		<more-options-tbody @change="changeAdvancedVisible" v-if="isOn()"></more-options-tbody>
+		<tbody v-show="isOn() && moreOptionsVisible">
+				<tr>
+					<td>内容最小长度</td>
+				<td>
+					<size-capacity-box :v-name="'minLength'" :v-value="config.minLength" :v-unit="'kb'"></size-capacity-box>
+					<p class="comment">0表示不限制，内容长度从文件尺寸或Content-Length中获取。</p>
+				</td>
+			</tr>
+			<tr>
+				<td>内容最大长度</td>
+				<td>
+					<size-capacity-box :v-name="'maxLength'" :v-value="config.maxLength" :v-unit="'mb'"></size-capacity-box>
+					<p class="comment">0表示不限制，内容长度从文件尺寸或Content-Length中获取。</p>
+				</td>
+			</tr>
+			<tr>
+				<td>匹配条件</td>
+				<td>
+					<http-request-conds-box :v-conds="config.conds" @change="changeConds"></http-request-conds-box>
+	</td>
+			</tr>
+		</tbody>
+	</table>			
+	<div class="ui margin"></div>
+</div>`
+})

web/views/@default/servers/server/settings/locations/webp/index.html

@@ -0,0 +1,18 @@
+{$layout}
+{$template "/left_menu"}
+
+<div class="right-box">
+    {$template "../location_menu"}
+    {$template "../left_menu"}
+
+    <div class="right-box tiny">
+        <form class="ui form" data-tea-action="$" data-tea-success="success">
+            <csrf-token></csrf-token>
+            <input type="hidden" name="webId" :value="webId"/>
+
+            <http-webp-config-box :v-webp-config="webpConfig" :v-is-location="true"></http-webp-config-box>
+
+            <submit-btn></submit-btn>
+        </form>
+    </div>
+</div>

web/views/@default/servers/server/settings/locations/webp/index.js

@@ -0,0 +1,3 @@
+Tea.context(function () {
+	this.success = NotifyReloadSuccess("保存成功")
+})

web/views/@default/servers/server/settings/webp/index.html

@@ -0,0 +1,13 @@
+{$layout}
+{$template "/left_menu"}
+
+<div class="right-box">
+    <form class="ui form" data-tea-action="$" data-tea-success="success">
+        <csrf-token></csrf-token>
+        <input type="hidden" name="webId" :value="webId"/>
+
+        <http-webp-config-box :v-webp-config="webpConfig"></http-webp-config-box>
+
+        <submit-btn></submit-btn>
+    </form>
+</div>

web/views/@default/servers/server/settings/webp/index.js

@@ -0,0 +1,3 @@
+Tea.context(function () {
+	this.success = NotifyReloadSuccess("保存成功")
+})