feat: support for access control in multi-user authentication mode

electron/api/config.ts

@@ -201,8 +201,10 @@ export const initConfigApi = win => {
           httpPassword: m.httpPassword || "",
           // 以下为stcp参数
           stcpModel: "visited",
+          serverUser: "",
           serverName: "",
           secretKey: m?.secretKey || "",
+          allowUsers: m?.allowUsers || [],
           bindAddr: "",
           bindPort: null,
           status: m?.status || true,
@@ -237,8 +239,10 @@ export const initConfigApi = win => {
           stcpModel: "visitors",
           serverName: m?.serverName,
           secretKey: m?.secretKey || "",
+          serverUser: m?.serverUser,
           bindAddr: m?.bindAddr,
           bindPort: m?.bindPort,
+          allowUsers: [],
           status: m?.status || true,
           fallbackTo: m?.fallbackTo,
           fallbackTimeoutMs: m?.fallbackTimeoutMs || 500,

electron/api/frpc.ts

@@ -115,6 +115,9 @@ localPort = ${m.localPort}\n`;
           toml += `serverName = "${m.serverName}"
 bindAddr = "${m.bindAddr}"
 bindPort = ${m.bindPort}\n`;
+          if (m.serverUser !== "") {
+            toml += `serverUser = "${m.serverUser}"\n`
+          }
           if (m.fallbackTo) {
             toml += `fallbackTo = "${m.fallbackTo}"
 fallbackTimeoutMs = ${m.fallbackTimeoutMs || 500}\n`;
@@ -123,6 +126,10 @@ fallbackTimeoutMs = ${m.fallbackTimeoutMs || 500}\n`;
           // 被访问者
           toml += `localIP = "${m.localIp}"
 localPort = ${m.localPort}\n`;
+const allowUsers = m.allowUsers.filter(f1 => f1 !== "");
+          if (allowUsers && allowUsers.length > 0) {
+            toml += `allowUsers = [${m.allowUsers.map(m => `"${m}"`)}]\n`;
+          }
         }
 
         toml += `secretKey="${m.secretKey}"\n`;
@@ -283,6 +290,7 @@ local_port = ${m.localPort}\n`;
           // 访问者
           ini += `
 role = visitor
+server_user = "${m.serverUser}"
 server_name = "${m.serverName}"
 bind_addr = "${m.bindAddr}"
 bind_port = ${m.bindPort}\n`;
@@ -294,6 +302,7 @@ fallback_timeout_ms = ${m.fallbackTimeoutMs || 500}\n`;
         } else if (m.stcpModel === "visited") {
           // 被访问者
           ini += `
+allow_users = ${m.allowUsers.map(m => `${m}`)}
 local_ip = "${m.localIp}"
 local_port = ${m.localPort}\n`;
         }

src/views/proxy/index.vue

@@ -53,8 +53,10 @@ const defaultForm = ref<Proxy>({
   remotePort: "8080",
   customDomains: [""],
   stcpModel: "visitors",
+  serverUser: "",
   serverName: "",
   secretKey: "",
+  allowUsers: [""],
   bindAddr: "",
   bindPort: null,
   status: true,
@@ -301,6 +303,21 @@ const handleDeleteDomain = (index: number) => {
   editForm.value.customDomains.splice(index, 1);
 };
 
+/**
+ * 添加允许访问用户名称
+ */
+ const handleAddUser = () => {
+  editForm.value.allowUsers.push("");
+};
+
+/**
+ * 删除允许访问用户名称
+ * @param index
+ */
+const handleDeleteUser = (index: number) => {
+  editForm.value.allowUsers.splice(index, 1);
+};
+
 /**
  * 加载代理
  */
@@ -913,6 +930,62 @@ onUnmounted(() => {
               </el-button>
             </el-form-item>
           </el-col>
+          <template v-if="(isStcp || isXtcp || isSudp) && isStcpVisited">
+            <el-col :span="24">
+              <el-form-item
+                v-for="(d, di) in editForm.allowUsers"
+                :key="'domain' + di"
+                :label="di === 0 ? '允许访问的访问者用户名称：' : ''"
+                :prop="`allowUsers.${di}`"
+              >
+                <template #label>
+                  <div class="inline-block">
+                    <div class="flex items-center">
+                      <div class="mr-1">
+                        <el-popover placement="top" trigger="hover" width="300">
+                          <template #default>
+                            对应参数：<span class="font-black text-[#5A3DAA]"
+                          >allowUsers</span
+                          >
+                            仅限于开启多用户验证方式后使用
+                          </template>
+                          <template #reference>
+                            <IconifyIconOffline
+                              class="text-base"
+                              color="#5A3DAA"
+                              icon="info"
+                            />
+                          </template>
+                        </el-popover>
+                      </div>
+                      允许访问的访问者用户名称：
+                    </div>
+                  </div>
+                </template>
+                <el-input
+                  class="user-input"
+                  placeholder="用户名称"
+                  v-model="editForm.allowUsers[di]"
+                />
+                <el-button
+                  class="ml-[10px]"
+                  type="primary"
+                  plain
+                  @click="handleAddUser"
+                >
+                  <IconifyIconOffline icon="add" />
+                </el-button>
+                <el-button
+                  type="danger"
+                  plain
+                  @click="handleDeleteUser(di)"
+                  :disabled="editForm.allowUsers.length === 1"
+                >
+                  <IconifyIconOffline icon="delete-rounded" />
+                </el-button>
+              </el-form-item>
+            </el-col>
+          </template>
           <template v-if="!(isStcp || isXtcp || isSudp) || isStcpVisited">
             <el-col :span="12">
               <el-form-item label="内网地址：" prop="localIp">
@@ -1248,6 +1321,39 @@ onUnmounted(() => {
             </el-col>
           </template>
           <template v-if="isStcpVisitors">
+            <el-col :span="24">
+              <el-form-item label="被访问者用户名称：" prop="serverUser">
+                <template #label>
+                  <div class="inline-block">
+                    <div class="flex items-center">
+                      <div class="mr-1">
+                        <el-popover placement="top" trigger="hover" width="300">
+                          <template #default>
+                            对应参数：<span class="font-black text-[#5A3DAA]"
+                          >serverUser</span
+                          >
+                            仅限于开启多用户验证方式后使用
+                          </template>
+                          <template #reference>
+                            <IconifyIconOffline
+                              class="text-base"
+                              color="#5A3DAA"
+                              icon="info"
+                            />
+                          </template>
+                        </el-popover>
+                      </div>
+                      被访问者用户名称：
+                    </div>
+                  </div>
+                </template>
+                <el-input
+                  type="text"
+                  v-model="editForm.serverUser"
+                  placeholder="stcp被访问者用户名称"
+                />
+              </el-form-item>
+            </el-col>
             <el-col :span="24">
               <el-form-item label="被访问者代理名称：" prop="serverName">
                 <el-input
@@ -1554,6 +1660,10 @@ onUnmounted(() => {
   width: calc(100% - 115px);
 }
 
+.user-input {
+  width: calc(100% - 115px);
+}
+
 .local-port-input {
   width: calc(100% - 120px);
 }

types/global.d.ts

@@ -22,8 +22,10 @@ declare global {
         remotePort: string;
         customDomains: string[];
         stcpModel: string;
+        serverUser: string;
         serverName: string;
         secretKey: string;
+        allowUsers: string[];
         bindAddr: string;
         bindPort: number;
         status: boolean;