优化交互

internal/web/actions/default/servers/server/settings/origins/addPopup.go

@@ -68,7 +68,7 @@ func (this *AddPopupAction) RunPost(params struct {
 	addr := params.Addr
 
 	// 是否是完整的地址
-	if params.Protocol == "http" || params.Protocol == "https" {
+	if (params.Protocol == "http" || params.Protocol == "https") && regexp.MustCompile(`^(http|https)://`).MatchString(addr) {
 		u, err := url.Parse(addr)
 		if err == nil {
 			addr = u.Host

internal/web/actions/default/servers/server/settings/origins/updatePopup.go

@@ -122,7 +122,7 @@ func (this *UpdatePopupAction) RunPost(params struct {
 	addr := params.Addr
 
 	// 是否是完整的地址
-	if params.Protocol == "http" || params.Protocol == "https" {
+	if (params.Protocol == "http" || params.Protocol == "https") && regexp.MustCompile(`^(http|https)://`).MatchString(addr) {
 		u, err := url.Parse(addr)
 		if err == nil {
 			addr = u.Host

web/views/@default/servers/addPortPopup.js

@@ -9,6 +9,8 @@ Tea.context(function () {
 	// 初始化
 	if (this.protocol == "http") {
 		this.address = "80"
+	} else if (this.protocol == "https") {
+		this.address = "443"
 	}
 
 	if (window.parent.UPDATING_ADDR != null) {
@@ -29,6 +31,7 @@ Tea.context(function () {
 				break
 			case "https":
 				this.address = "443"
+				break
 		}
 	}
 

web/views/@default/servers/server/settings/origins/addPopup.html

@@ -10,7 +10,7 @@
 			<td>源站协议</td>
 			<td>
 				<!-- HTTP -->
-				<select class="ui dropdown auto-width" name="protocol" v-model="protocol" v-if="serverType == 'httpProxy' || serverType == 'httpWeb'">
+				<select class="ui dropdown auto-width" name="protocol" v-model="protocol" v-if="serverType == 'httpProxy' || serverType == 'httpWeb'" @change="changeProtocol">
 					<option value="http">HTTP</option>
 					<option value="https">HTTPS</option>
 				</select>
@@ -26,7 +26,8 @@
 			<td class="title">源站地址 *</td>
 			<td>
 				<input type="text" name="addr" ref="focus" v-model="addr" @input="changeAddr"/>
-				<p class="comment">源站服务器地址，通常是一个IP（或域名）加端口<span v-if="serverType == 'httpProxy'">，不需要加 http:// 或 https://</span>。</p>
+				<p class="comment"><span class="red" v-if="addrError.length > 0">{{addrError}}</span>
+                    源站服务器地址，通常是一个IP（或域名）加端口<span v-if="serverType == 'httpProxy'">，不需要加 http:// 或 https://</span>。</p>
 			</td>
 		</tr>
 		<tr>

web/views/@default/servers/server/settings/origins/addPopup.js

@@ -2,10 +2,16 @@ Tea.context(function () {
 	this.addr = ""
 	this.protocol = ""
 
+	this.addrError = ""
+
 	if (this.isHTTP) {
 		this.protocol = "http"
 	}
 
+	this.changeProtocol = function () {
+		this.checkPort()
+	}
+
 	this.changeAddr = function () {
 		if (this.serverType == "httpProxy") {
 			if (this.addr.startsWith("http://")) {
@@ -14,5 +20,25 @@ Tea.context(function () {
 				this.protocol = "https"
 			}
 		}
+
+		this.checkPort()
+	}
+
+	this.checkPort = function () {
+		this.addrError = ""
+
+		// HTTP
+		if (this.protocol == "http") {
+			if (this.addr.endsWith(":443")) {
+				this.addrError = "443通常是HTTPS协议端口，请确认源站协议选择是否正确。"
+			}
+		}
+
+		// HTTPS
+		if (this.protocol == "https") {
+			if (this.addr.endsWith(":80")) {
+				this.addrError = "80通常是HTTP协议端口，请确认源站协议选择是否正确。"
+			}
+		}
 	}
 })

web/views/@default/servers/server/settings/origins/updatePopup.html

@@ -12,7 +12,7 @@
 			<td>源站协议</td>
 			<td>
 				<!-- HTTP -->
-				<select class="ui dropdown auto-width" name="protocol" v-model="origin.protocol" v-if="serverType == 'httpProxy' || serverType == 'httpWeb'">
+				<select class="ui dropdown auto-width" name="protocol" v-model="origin.protocol" v-if="serverType == 'httpProxy' || serverType == 'httpWeb'" @change="changeProtocol">
 					<option value="http">HTTP</option>
 					<option value="https">HTTPS</option>
 				</select>
@@ -28,7 +28,7 @@
 			<td class="title">源站地址</td>
 			<td>
 				<input type="text" name="addr" ref="focus" v-model="origin.addr" @input="changeAddr"/>
-				<p class="comment">源站服务器地址，通常是一个IP（或域名）加端口<span v-if="serverType == 'httpProxy'">，不需要加 http:// 或 https://</span>。</p>
+				<p class="comment"><span class="red" v-if="addrError.length > 0">{{addrError}}</span>源站服务器地址，通常是一个IP（或域名）加端口<span v-if="serverType == 'httpProxy'">，不需要加 http:// 或 https://</span>。</p>
 			</td>
 		</tr>
 		<tr>

web/views/@default/servers/server/settings/origins/updatePopup.js

@@ -1,4 +1,14 @@
 Tea.context(function () {
+	this.addrError = ""
+
+	this.$delay(function () {
+		this.checkPort()
+	})
+
+	this.changeProtocol = function () {
+		this.checkPort()
+	}
+
 	this.changeAddr = function () {
 		if (this.serverType == "httpProxy") {
 			if (this.origin.addr.startsWith("http://")) {
@@ -7,5 +17,25 @@ Tea.context(function () {
 				this.origin.protocol = "https"
 			}
 		}
+
+		this.checkPort()
+	}
+
+	this.checkPort = function () {
+		this.addrError = ""
+
+		// HTTP
+		if (this.origin.protocol == "http") {
+			if (this.origin.addr.endsWith(":443")) {
+				this.addrError = "443通常是HTTPS协议端口，请确认源站协议选择是否正确。"
+			}
+		}
+
+		// HTTPS
+		if (this.origin.protocol == "https") {
+			if (this.origin.addr.endsWith(":80")) {
+				this.addrError = "80通常是HTTP协议端口，请确认源站协议选择是否正确。"
+			}
+		}
 	}
 })