add login page screenshots

update package script
store auth information with session
2026-04-04 06:16:59 +08:00 · 2023-09-14 13:11:37 +08:00 · 2023-09-14 13:05:54 +08:00 · 2023-09-14 12:45:21 +08:00 · 2023-09-13 23:23:37 +08:00 · 2023-09-13 20:27:24 +08:00
24 changed files with 579 additions and 199 deletions
--- a/README.md
+++ b/README.md
@@ -7,6 +7,7 @@ frp server plugin to show server info and support multiple users for [frp](https
 frps-panel will run as one single process and accept HTTP requests from frps.

 ![支持英文](screenshots/i18n.png)
+![登录页面](screenshots/login.png)
 ![服务器信息](screenshots/server%20info.png)
 ![用户列表](screenshots/user%20list.png)
 ![新增列表](screenshots/new%20user.png)
@@ -47,6 +48,8 @@ plugin_port = 7200
 admin_user  = admin
 ;the password of manage ui,optional
 admin_pwd   = admin
+;specified login state keep time in seconds.0 - before the browser completely exit, don't need to re-login,greater than 0: when Idle time exceeds this value,you should re-login
+admin_keep_time = 0

 ; enable tls
 tls_mode = false
@@ -58,8 +61,6 @@ dashboard_addr = 127.0.0.1
 dashboard_port = 7500
 dashboard_user = admin
 dashboard_pwd  = admin
-; if your frps dashboard enable tls, change this to true
-dashboard_tls  = false

 [users]
 ;user user1 with meta_token 123
@@ -98,6 +99,7 @@ user2 = disable
 bind_port = 7000

 [plugin.multiuser]
+; if you set tls_mode = true, you should change addr value to https://127.0.0.1:7200
 addr = 127.0.0.1:7200
 path = /handler
 ops = Login,NewWorkConn,NewUserConn,NewProxy,Ping
@@ -137,6 +139,8 @@ local_port = 22
 remote_port = 6000
 ```

+5. Manage your users in browser via: http://127.0.0.1:7200 or https://127.0.0.1:7200
+
 ## Run as service

 this example is for `ubuntu` and with `root` user
--- a/README_zh.md
+++ b/README_zh.md
@@ -7,6 +7,7 @@ frps-panel 是 [frp](https://github.com/fatedier/frp) 的一个服务端插件
 frps-panel 会以一个单独的进程运行，并接收 frps 发送过来的 HTTP 请求。

 ![支持英文](screenshots/i18n.png)
+![登录页面](screenshots/login.png)
 ![服务器信息](screenshots/server%20info.png)
 ![用户列表](screenshots/user%20list.png)
 ![新增列表](screenshots/new%20user.png)
@@ -41,6 +42,7 @@ frps-panel 会以一个单独的进程运行，并接收 frps 发送过来的 HT
 ```ini
 [common]
 ;插件监听地址
+;如果上面配置中 tls_mode = true, 则把plugin_addr的值改为 https://127.0.0.1:7200
 plugin_addr = 127.0.0.1
 ;插件端口
 plugin_port = 7200
@@ -48,6 +50,8 @@ plugin_port = 7200
 admin_user  = admin
 ;插件管理页面密码,与账号一起进行鉴权,可选
 admin_pwd   = admin
+;登录状态空闲时间(秒):0-浏览器完全退出前不用重新登录,大于0-空闲超过此时间则需要重新登录.
+admin_keep_time = 0

 ; frps 面板页面是否启用https访问,如果为true,则只能通过https访问
 tls_mode = false
@@ -59,8 +63,6 @@ dashboard_addr = 127.0.0.1
 dashboard_port = 7500
 dashboard_user = admin
 dashboard_pwd  = admin
-; 如果frps的dashboard启用了tls，则把这个选项置为true，否则无法获取服务器信息
-dashboard_tls  = false

 [users]
 ;user1的meta_token为123
@@ -138,6 +140,8 @@ local_port = 22
 remote_port = 6000
 ```

+5.浏览器中输入地址: http://127.0.0.1:7200 或 https://127.0.0.1:7200 进入管理页面进行用户管理
+
 ## 以服务的形式运行

 本实例是在 `ubuntu` 下， 以 `root` 用户执操作
--- a/assets/lang/en.json
+++ b/assets/lang/en.json
@@ -90,5 +90,13 @@
  "Client Counts": "Client Counts",
  "Proxy Counts": "Proxy Counts",
  "Not Set": "Not Set",
-  "Proxy": "Proxies"
+  "Proxy": "Proxies",
+  "Username": "Username",
+  "Password": "Password",
+  "Login": "Login",
+  "Please input username": "Please input username",
+  "Please input password": "Please input password",
+  "Login success": "Login success",
+  "Username or password incorrect": "Username or password incorrect",
+  "Token invalid": "Token invalid"
 }
--- a/assets/lang/zh.json
+++ b/assets/lang/zh.json
@@ -90,5 +90,13 @@
  "Client Counts": "客户端总数",
  "Proxy Counts": "代理总数",
  "Not Set": "未配置",
-  "Proxy": "代理数量"
+  "Proxy": "代理数量",
+  "Username": "用户名",
+  "Password": "密码",
+  "Login": "登录",
+  "Please input username": "请填写用户名",
+  "Please input password": "请填写密码",
+  "Login success": "登录成功",
+  "Username or password incorrect": "用户名或密码错误",
+  "Token invalid": "登录信息无效"
 }
--- a/assets/static/css/index-color.css
+++ b/assets/static/css/index-color.css
@@ -113,7 +113,17 @@ section.proxy-list .proxy-info .layui-row .layui-row > div:first-child {
    color: #99a9bf;
 }

+.login-title,
+.login-title a {
+    color: #333 !important;
+}
+
@media (prefers-color-scheme: dark) {
+    .login-title,
+    .login-title a {
+        color: #99a9bf !important;
+    }
+
    .layui-bg-blue {
        background-color: #395c74 !important;
    }
@@ -154,6 +164,11 @@ section.proxy-list .proxy-info .layui-row .layui-row > div:first-child {
        border-color: #5f5f60;
    }

+    .layui-form-danger + .layui-form-select .layui-input,
+    .layui-form-danger:focus {
+        border-color: #ff5722 !important;
+    }
+
    .layui-form-checkbox[lay-skin=primary]:hover > i {
        border-color: #5f5f60;
    }
--- a/assets/static/css/index.css
+++ b/assets/static/css/index.css
@@ -14,6 +14,10 @@ section {
    box-sizing: border-box;
 }

+.layui-layout-admin .layui-body {
+    padding: 0;
+}
+
 .layui-header {
    line-height: 60px;
    font-size: 16px;
@@ -43,6 +47,19 @@ section {
    height: 100%;
    padding: 0 15px;
    box-sizing: border-box;
+    display: flex;
+}
+
+.layui-title #title {
+    flex: 1;
+    display: inline-block;
+}
+
+.layui-title #logout{
+    display: inline-block;
+    font-size: 20px;
+    font-weight: bold;
+    cursor: pointer;
 }

 .layui-nav.layui-nav-tree {
--- a/assets/static/css/login.css
+++ b/assets/static/css/login.css
@@ -0,0 +1,30 @@
+html, body {
+    width: 100%;
+    height: 100%;
+}
+
+body {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+}
+
+.login-title {
+    text-align: center;
+    margin-bottom: 50px;
+}
+
+.login-title .title-text {
+    font-size: 24px;
+    text-align: center;
+    font-weight: bold;
+}
+
+.login-title .title-version {
+    font-size: 12px;
+}
+
+.login-container {
+    width: 320px;
+    margin: 0 auto;
+}
--- a/assets/static/js/index-proxy-list.js
+++ b/assets/static/js/index-proxy-list.js
@@ -106,6 +106,10 @@ var loadProxyInfo = (function ($) {
            cols: [cols],
            page: navigator.language.indexOf("zh") !== -1,
            data: data,
+            initSort: {
+                field: 'name',
+                type: 'asc'
+            },
            done: function (res, curr, count, origin) {
                //向每一行tr后面追加显示子table的tr
                var $tr = $('.layui-table-view[lay-id=' + this.id + '] tbody tr');
@@ -116,7 +120,6 @@ var loadProxyInfo = (function ($) {
                    var useCompression = datum.conf.use_compression;
                    datum.conf.use_encryption = i18n[useEncryption];
                    datum.conf.use_compression = i18n[useCompression];
-                    console.log(datum)
                    var html = layui.laytpl(expandTrTemplateHtml).render({
                        index: i,
                        colspan: cols.length - 1,
--- a/assets/static/js/index.js
+++ b/assets/static/js/index.js
@@ -1,26 +1,50 @@
 var http_port, https_port;
 (function ($) {
    $(function () {
-        var langLoading = layui.layer.load()
-        $.getJSON('/lang.json').done(function (lang) {
-            layui.element.on('nav(leftNav)', function (elem) {
-                var id = elem.attr('id');
-                var title = elem.text();
-                if (id === 'serverInfo') {
-                    loadServerInfo(lang, title.trim());
-                } else if (id === 'userList') {
-                    loadUserList(lang, title.trim());
-                } else if (elem.closest('.layui-nav-item').attr('id') === 'proxyList') {
-                    if (id != null && id.trim() !== '') {
-                        var suffix = elem.closest('.layui-nav-item').children('a').text().trim();
-                        loadProxyInfo(lang, title + " " + suffix, id);
-                    }
-                }
-            });
+        function init() {
+            var langLoading = layui.layer.load()
+            $.getJSON('/lang.json').done(function (lang) {
+                $.ajaxSetup({
+                    error: function (xhr,) {
+                        if (xhr.status === 401) {
+                            layui.layer.msg(lang['TokenInvalid'], function () {
+                                window.location.reload();
+                            });
+                        }
+                    },
+                })

-            $('#leftNav .layui-this > a').click();
-        }).always(function () {
-            layui.layer.close(langLoading);
+                layui.element.on('nav(leftNav)', function (elem) {
+                    var id = elem.attr('id');
+                    var title = elem.text();
+                    if (id === 'serverInfo') {
+                        loadServerInfo(lang, title.trim());
+                    } else if (id === 'userList') {
+                        loadUserList(lang, title.trim());
+                    } else if (elem.closest('.layui-nav-item').attr('id') === 'proxyList') {
+                        if (id != null && id.trim() !== '') {
+                            var suffix = elem.closest('.layui-nav-item').children('a').text().trim();
+                            loadProxyInfo(lang, title + " " + suffix, id);
+                        }
+                    }
+                });
+
+                $('#leftNav .layui-this > a').click();
+            }).always(function () {
+                layui.layer.close(langLoading);
+            });
+        }
+
+        function logout() {
+            $.get("/logout", function (result) {
+                window.location.reload();
+            });
+        }
+
+        $(document).on('click.logout', '#logout', function () {
+            logout();
        });
+
+        init();
    });
 })(layui.$);
--- a/assets/static/js/login.js
+++ b/assets/static/js/login.js
@@ -0,0 +1,33 @@
+(function ($) {
+    $(function () {
+        function login() {
+            if (!layui.form.validate('#loginForm')) {
+                return;
+            }
+
+            $.ajax({
+                url: "/login",
+                type: 'post',
+                data: {
+                    username: $('#username').val(),
+                    password: $('#password').val()
+                },
+                success: function (result) {
+                    if (result.success) {
+                        window.location.reload();
+                    } else {
+                        layui.layer.msg(result.message);
+                    }
+                }
+            });
+        }
+
+        $(document).on('click.login', '#login', function () {
+            login();
+        }).on('keydown', function (e) {
+            if (e.keyCode === 13) {
+                login();
+            }
+        });
+    })
+})(layui.$)
--- a/assets/templates/index.html
+++ b/assets/templates/index.html
@@ -5,7 +5,7 @@
    <link rel="stylesheet" href="./static/lib/layui/css/layui.css">
    <link rel="stylesheet" href="./static/css/layui-theme-dark.css">
    <link rel="stylesheet" href="./static/css/index.css">
-    <link rel="stylesheet" href="./static/css/index-color.css">
+    <link rel="stylesheet" href="./static/css/color.css">
    <script src="./static/lib/layui/layui.js"></script>
    <script src="./static/lib/echarts.min.js"></script>
    <script src="./static/lib/filesize.min.js"></script>
@@ -22,17 +22,17 @@
            content: '${ .None }';
        }
    </style>
-    <style>
-        .layui-layout-admin .layui-body {
-            padding: 0;
-        }
-    </style>
 </head>
 <body>
 <div class="layui-layout layui-layout-admin">
    <div class="layui-header layui-bg-blue">
-        <div class="layui-logo layui-hide-xs layui-bg-black">${ .FrpsPanel }</div>
-        <div class="layui-title" id="title"></div>
+        <div class="layui-logo layui-bg-black">${ .FrpsPanel }</div>
+        <div class="layui-title">
+            <span id="title"></span>
+            ${ if .showExit }
+            <span class="layui-icon layui-icon-logout" id="logout"></span>
+            ${ end }
+        </div>
    </div>
    <div class="layui-side layui-bg-black">
        <div class="layui-side-scroll">
--- a/assets/templates/login.html
+++ b/assets/templates/login.html
@@ -0,0 +1,43 @@
+<!DOCTYPE html>
+<html lang="">
+<head>
+    <title>Login</title>
+    <link rel="stylesheet" href="./static/lib/layui/css/layui.css">
+    <link rel="stylesheet" href="./static/css/layui-theme-dark.css">
+    <link rel="stylesheet" href="./static/css/color.css">
+    <link rel="stylesheet" href="./static/css/login.css">
+    <script src="./static/lib/layui/layui.js"></script>
+    <script src="./static/js/login.js"></script>
+</head>
+<body>
+<div class="login-title">
+    <a href="https://github.com/yhl452493373/frps-panel" target="_blank">
+        <span class="title-text">${ .FrpsPanel }</span>
+        <span class="title-version">${ .version }</span>
+    </a>
+</div>
+<div class="layui-form login-container" id="loginForm">
+    <div class="layui-form-item">
+        <div class="layui-input-wrap">
+            <div class="layui-input-prefix">
+                <i class="layui-icon layui-icon-username"></i>
+            </div>
+            <input type="text" id="username" value="" lay-verify="required" placeholder="${ .Username }"
+                   lay-reqtext="${ .PleaseInputUsername }" autocomplete="off" class="layui-input" lay-affix="clear">
+        </div>
+    </div>
+    <div class="layui-form-item">
+        <div class="layui-input-wrap">
+            <div class="layui-input-prefix">
+                <i class="layui-icon layui-icon-password"></i>
+            </div>
+            <input type="password" id="password" value="" lay-verify="required" placeholder="${ .Password }"
+                   lay-reqtext="${ .PleaseInputPassword }" autocomplete="off" class="layui-input" lay-affix="eye">
+        </div>
+    </div>
+    <div class="layui-form-item">
+        <button class="layui-btn layui-btn-fluid" id="login">${ .Login }</button>
+    </div>
+</div>
+</body>
+</html>
--- a/cmd/frps-panel/cmd.go
+++ b/cmd/frps-panel/cmd.go
@@ -13,7 +13,7 @@ import (
 	"strings"
 )

-const version = "1.5.0"
+const version = "1.6.0"

 var (
 	showVersion bool
@@ -119,11 +119,16 @@ func ParseConfigFile(file string) (controller.HandleController, server.TLS, erro
 	common.PluginPort = commonSection.Key("plugin_port").MustInt(7200)
 	common.User = commonSection.Key("admin_user").Value()
 	common.Pwd = commonSection.Key("admin_pwd").Value()
-	common.DashboardTLS = commonSection.Key("dashboard_tls").MustBool(false)
+	common.KeepTime = commonSection.Key("admin_keep_time").MustInt(0)
 	common.DashboardAddr = commonSection.Key("dashboard_addr").MustString("127.0.0.1")
 	common.DashboardPort = commonSection.Key("dashboard_port").MustInt(7500)
 	common.DashboardUser = commonSection.Key("dashboard_user").Value()
 	common.DashboardPwd = commonSection.Key("dashboard_pwd").Value()
+	common.DashboardTLS = strings.HasPrefix(strings.ToLower(common.DashboardAddr), "https://")
+
+	if common.KeepTime < 0 {
+		common.KeepTime = 0
+	}

 	tls.Enable = commonSection.Key("tls_mode").MustBool(false)
 	tls.Cert = commonSection.Key("tls_cert_file").MustString("")
--- a/config/frps-panel.ini
+++ b/config/frps-panel.ini
@@ -5,6 +5,8 @@ plugin_addr = 127.0.0.1
 plugin_port = 7200
 admin_user = admin
 admin_pwd = admin
+; specified login state keep time
+admin_keep_time = 0

 ; enable tls
 tls_mode = false
@@ -16,8 +18,6 @@ dashboard_addr = 127.0.0.1
 dashboard_port = 7500
 dashboard_user = admin
 dashboard_pwd = admin
-; if your frps dashboard enable tls, change this to true
-dashboard_tls = false

 ; user tokens
 [users]
--- a/go.mod
+++ b/go.mod
@@ -17,11 +17,15 @@ require (
 	github.com/fatedier/beego v0.0.0-20171024143340-6c6a4f5bd5eb // indirect
 	github.com/fatedier/golib v0.1.1-0.20200901083111-1f870741e185 // indirect
 	github.com/gabriel-vasile/mimetype v1.4.2 // indirect
+	github.com/gin-contrib/sessions v0.0.5 // indirect
 	github.com/gin-contrib/sse v0.1.0 // indirect
 	github.com/go-playground/locales v0.14.1 // indirect
 	github.com/go-playground/universal-translator v0.18.1 // indirect
 	github.com/go-playground/validator/v10 v10.14.1 // indirect
 	github.com/goccy/go-json v0.10.2 // indirect
+	github.com/gorilla/context v1.1.1 // indirect
+	github.com/gorilla/securecookie v1.1.1 // indirect
+	github.com/gorilla/sessions v1.2.1 // indirect
 	github.com/inconshreveable/mousetrap v1.0.0 // indirect
 	github.com/json-iterator/go v1.1.12 // indirect
 	github.com/klauspost/cpuid/v2 v2.2.5 // indirect
--- a/go.sum
+++ b/go.sum
@@ -46,6 +46,8 @@ github.com/gabriel-vasile/mimetype v1.4.2/go.mod h1:zApsH/mKG4w07erKIaJPFiX0Tsq9
 github.com/ghodss/yaml v0.0.0-20150909031657-73d445a93680/go.mod h1:4dBDuWmgqj2HViK6kFavaiC9ZROes6MMH2rRYeMEF04=
 github.com/gin-contrib/i18n v1.0.0 h1:e5uEOmaAr09Iyr4vuWuvvpByjmvxGDO7iSkmiFpSsk0=
 github.com/gin-contrib/i18n v1.0.0/go.mod h1:yyyTArpVZeXCFT/kbLbD5CS192+OZ8Y+angnJjvnB98=
+github.com/gin-contrib/sessions v0.0.5 h1:CATtfHmLMQrMNpJRgzjWXD7worTh7g7ritsQfmF+0jE=
+github.com/gin-contrib/sessions v0.0.5/go.mod h1:vYAuaUPqie3WUSsft6HUlCjlwwoJQs97miaG2+7neKY=
 github.com/gin-contrib/sse v0.1.0 h1:Y/yl/+YNO8GZSjAhjMsSuLt29uWRFHdHYUb5lYOV9qE=
 github.com/gin-contrib/sse v0.1.0/go.mod h1:RHrZQHXnP2xjPF+u1gW/2HnVO7nvIa9PG3Gm+fLHvGI=
 github.com/gin-gonic/gin v1.9.1 h1:4idEAncQnU5cB7BeOkPtxjfCSye0AAm1R0RVIqJ+Jmg=
@@ -95,7 +97,13 @@ github.com/google/gofuzz v1.1.0/go.mod h1:dBl0BpW6vV/+mYPU4Po3pmUjxk6FQPldtuIdl/
 github.com/google/uuid v1.1.1/go.mod h1:TIyPZe4MgqvfeYDBFedMoGGpEw/LqOeaOT+nhxU+yHo=
 github.com/googleapis/gnostic v0.0.0-20170729233727-0c5108395e2d/go.mod h1:sJBsCZ4ayReDTBIg8b9dl28c5xFWyhBTVRp3pOg5EKY=
 github.com/googleapis/gnostic v0.1.0/go.mod h1:sJBsCZ4ayReDTBIg8b9dl28c5xFWyhBTVRp3pOg5EKY=
+github.com/gorilla/context v1.1.1 h1:AWwleXJkX/nhcU9bZSnZoi3h/qGYqQAGhq6zZe/aQW8=
+github.com/gorilla/context v1.1.1/go.mod h1:kBGZzfjB9CEq2AlWe17Uuf7NDRt0dE0s8S51q0aT7Yg=
 github.com/gorilla/mux v1.7.3/go.mod h1:1lud6UwP+6orDFRuTfBEV8e9/aOM/c4fVVCaMa2zaAs=
+github.com/gorilla/securecookie v1.1.1 h1:miw7JPhV+b/lAHSXz4qd/nN9jRiAFV5FwjeKyCS8BvQ=
+github.com/gorilla/securecookie v1.1.1/go.mod h1:ra0sb63/xPlUeL+yeDciTfxMRAA+MP+HVt/4epWDjd4=
+github.com/gorilla/sessions v1.2.1 h1:DHd3rPN5lE3Ts3D8rKkQ8x/0kqfeNmBAaiSi+o7FsgI=
+github.com/gorilla/sessions v1.2.1/go.mod h1:dk2InVEVJ0sfLlnXv9EAgkf6ecYs/i80K/zI+bUmuGM=
 github.com/gorilla/websocket v1.4.0/go.mod h1:E7qHFY5m1UJ88s3WnNqhKjPHQ0heANvMoAMk2YaljkQ=
 github.com/hashicorp/golang-lru v0.5.1/go.mod h1:/m3WP610KZHVQ1SGc6re/UDhFvYD7pJ4Ao+sR/qLZy8=
 github.com/hashicorp/yamux v0.0.0-20181012175058-2f1d1f20f75d/go.mod h1:+NfK9FKeTrX5uv1uIXGdwYDTeHna2qgaIlx54MXqjAM=
--- a/package.sh
+++ b/package.sh
@@ -1,4 +1,5 @@
 #!/bin/bash
+version=$(cat cmd/frps-panel/cmd.go | grep 'const version' | egrep -o '[0-9.]+')
 cd ./release || exit
 rm -rf *.zip
 list=$(ls frps-panel-*)
@@ -6,11 +7,13 @@ echo "$list"
 for binFile in $list
  do
    tmpFile=frps-panel
+    newBinFile=$binFile
    if echo "$binFile" | grep  -q -E "\.exe";then
      tmpFile=frps-panel.exe
+      newBinFile=${newBinFile%%.exe*}
    fi
    cp "$binFile" "$tmpFile"
-    zip -r "$binFile".zip "$tmpFile" frps-panel.ini assets -x "*.git*" "*.idea*" "*.DS_Store" "*.contentFlavour"
+    zip -r "$newBinFile-$version".zip "$tmpFile" frps-panel.ini assets -x "*.git*" "*.idea*" "*.DS_Store" "*.contentFlavour"
    rm -rf "$binFile" "$tmpFile"
  done
  rm -rf frps-panel.ini assets
--- a/pkg/server/controller/authorizer.go
+++ b/pkg/server/controller/authorizer.go
@@ -0,0 +1,104 @@
+package controller
+
+import (
+	"encoding/base64"
+	"fmt"
+	"github.com/gin-contrib/sessions"
+	"github.com/gin-gonic/gin"
+	"net/http"
+	"strings"
+	"time"
+)
+
+func (c *HandleController) BasicAuth() gin.HandlerFunc {
+	return func(context *gin.Context) {
+		if strings.TrimSpace(c.CommonInfo.User) == "" || strings.TrimSpace(c.CommonInfo.Pwd) == "" {
+			if context.Request.RequestURI == LoginUrl {
+				context.Redirect(http.StatusTemporaryRedirect, LoginSuccessUrl)
+			}
+			return
+		}
+
+		session := sessions.Default(context)
+		auth := session.Get(AuthName)
+
+		if auth != nil {
+			if c.CommonInfo.KeepTime > 0 {
+				cookie, _ := context.Request.Cookie(SessionName)
+				if cookie != nil {
+					//important thx https://blog.csdn.net/zhanghongxia8285/article/details/107321838/
+					cookie.Expires = time.Now().Add(time.Second * time.Duration(c.CommonInfo.KeepTime))
+					http.SetCookie(context.Writer, cookie)
+				}
+			}
+
+			username, password, _ := parseBasicAuth(fmt.Sprintf("%v", auth))
+
+			usernameMatch := username == c.CommonInfo.User
+			passwordMatch := password == c.CommonInfo.Pwd
+
+			if usernameMatch && passwordMatch {
+				context.Next()
+				return
+			}
+		}
+
+		isAjax := context.GetHeader("X-Requested-With") == "XMLHttpRequest"
+
+		if !isAjax && context.Request.RequestURI != LoginUrl {
+			context.Redirect(http.StatusTemporaryRedirect, LoginUrl)
+		} else {
+			context.AbortWithStatus(http.StatusUnauthorized)
+		}
+	}
+}
+
+func (c *HandleController) LoginAuth(username, password string, context *gin.Context) bool {
+	if strings.TrimSpace(c.CommonInfo.User) == "" || strings.TrimSpace(c.CommonInfo.Pwd) == "" {
+		return true
+	}
+
+	session := sessions.Default(context)
+
+	sessionAuth := session.Get(AuthName)
+	internalAuth := encodeBasicAuth(c.CommonInfo.User, c.CommonInfo.Pwd)
+
+	if sessionAuth == internalAuth {
+		return true
+	} else {
+		basicAuth := encodeBasicAuth(username, password)
+		if basicAuth == internalAuth {
+			session.Set(AuthName, basicAuth)
+			_ = session.Save()
+			return true
+		} else {
+			session.Delete(AuthName)
+			_ = session.Save()
+			return false
+		}
+	}
+}
+
+func ClearAuth(context *gin.Context) {
+	session := sessions.Default(context)
+	session.Delete(AuthName)
+	_ = session.Save()
+}
+
+func parseBasicAuth(auth string) (username, password string, ok bool) {
+	c, err := base64.StdEncoding.DecodeString(auth)
+	if err != nil {
+		return "", "", false
+	}
+	cs := string(c)
+	username, password, ok = strings.Cut(cs, ":")
+	if !ok {
+		return "", "", false
+	}
+	return username, password, true
+}
+
+func encodeBasicAuth(username, password string) string {
+	authString := fmt.Sprintf("%s:%s", username, password)
+	return base64.StdEncoding.EncodeToString([]byte(authString))
+}
--- a/pkg/server/controller/controller.go
+++ b/pkg/server/controller/controller.go
@@ -2,7 +2,6 @@ package controller

 import (
 	"crypto/tls"
-	"encoding/base64"
 	"encoding/json"
 	"errors"
 	"fmt"
@@ -12,105 +11,11 @@ import (
 	"io"
 	"log"
 	"net/http"
-	"regexp"
 	"sort"
 	"strconv"
 	"strings"
 )

-const (
-	Success          = 0
-	ParamError       = 1
-	UserExist        = 2
-	SaveError        = 3
-	UserFormatError  = 4
-	TokenFormatError = 5
-	FrpServerError   = 6
-)
-
-var UserFormatReg = regexp.MustCompile("^\\w+$")
-var TokenFormatReg = regexp.MustCompile("^[\\w!@#$%^&*()]+$")
-var TrimAllSpaceReg = regexp.MustCompile("[\\n\\t\\r\\s]")
-var TrimBreakLineReg = regexp.MustCompile("[\\n\\t\\r]")
-
-type Response struct {
-	Msg string `json:"msg"`
-}
-
-type HTTPError struct {
-	Code int
-	Err  error
-}
-
-type CommonInfo struct {
-	PluginAddr    string
-	PluginPort    int
-	User          string
-	Pwd           string
-	DashboardTLS  bool
-	DashboardAddr string
-	DashboardPort int
-	DashboardUser string
-	DashboardPwd  string
-}
-
-type TokenInfo struct {
-	User       string `json:"user" form:"user"`
-	Token      string `json:"token" form:"token"`
-	Comment    string `json:"comment" form:"comment"`
-	Ports      string `json:"ports" from:"ports"`
-	Domains    string `json:"domains" from:"domains"`
-	Subdomains string `json:"subdomains" from:"subdomains"`
-	Status     bool   `json:"status" form:"status"`
-}
-
-type TokenResponse struct {
-	Code  int         `json:"code"`
-	Msg   string      `json:"msg"`
-	Count int         `json:"count"`
-	Data  []TokenInfo `json:"data"`
-}
-
-type OperationResponse struct {
-	Success bool   `json:"success"`
-	Code    int    `json:"code"`
-	Message string `json:"message"`
-}
-
-type ProxyResponse struct {
-	OperationResponse
-	Data string `json:"data"`
-}
-
-type TokenSearch struct {
-	TokenInfo
-	Page  int `form:"page"`
-	Limit int `form:"limit"`
-}
-
-type TokenUpdate struct {
-	Before TokenInfo `json:"before"`
-	After  TokenInfo `json:"after"`
-}
-
-type TokenRemove struct {
-	Users []TokenInfo `json:"users"`
-}
-
-type TokenDisable struct {
-	TokenRemove
-}
-
-type TokenEnable struct {
-	TokenDisable
-}
-
-func (e *HTTPError) Error() string {
-	return e.Err.Error()
-}
-
-type HandlerFunc func(ctx *gin.Context) (interface{}, error)
-
 func (c *HandleController) MakeHandlerFunc() gin.HandlerFunc {
 	return func(context *gin.Context) {
 		var response plugin.Response
@@ -118,19 +23,13 @@ func (c *HandleController) MakeHandlerFunc() gin.HandlerFunc {

 		request := plugin.Request{}
 		if err := context.BindJSON(&request); err != nil {
-			_ = context.Error(&HTTPError{
-				Code: http.StatusBadRequest,
-				Err:  err,
-			})
+			_ = context.AbortWithError(http.StatusBadRequest, err)
 			return
 		}

 		jsonStr, err := json.Marshal(request.Content)
 		if err != nil {
-			_ = context.Error(&HTTPError{
-				Code: http.StatusBadRequest,
-				Err:  err,
-			})
+			_ = context.AbortWithError(http.StatusBadRequest, err)
 			return
 		}

@@ -175,10 +74,54 @@ func (c *HandleController) MakeHandlerFunc() gin.HandlerFunc {
 	}
 }

-func (c *HandleController) MakeManagerFunc() func(context *gin.Context) {
+func (c *HandleController) MakeLoginFunc() func(context *gin.Context) {
+	return func(context *gin.Context) {
+		if context.Request.Method == "GET" {
+			if c.LoginAuth("", "", context) {
+				if context.Request.RequestURI == LoginUrl {
+					context.Redirect(http.StatusTemporaryRedirect, LoginSuccessUrl)
+				}
+				return
+			}
+			context.HTML(http.StatusOK, "login.html", gin.H{
+				"version":             c.Version,
+				"FrpsPanel":           ginI18n.MustGetMessage(context, "Frps Panel"),
+				"Username":            ginI18n.MustGetMessage(context, "Username"),
+				"Password":            ginI18n.MustGetMessage(context, "Password"),
+				"Login":               ginI18n.MustGetMessage(context, "Login"),
+				"PleaseInputUsername": ginI18n.MustGetMessage(context, "Please input username"),
+				"PleaseInputPassword": ginI18n.MustGetMessage(context, "Please input password"),
+			})
+		} else if context.Request.Method == "POST" {
+			username := context.PostForm("username")
+			password := context.PostForm("password")
+			if c.LoginAuth(username, password, context) {
+				context.JSON(http.StatusOK, gin.H{
+					"success": true,
+					"message": ginI18n.MustGetMessage(context, "Login success"),
+				})
+			} else {
+				context.JSON(http.StatusOK, gin.H{
+					"success": false,
+					"message": ginI18n.MustGetMessage(context, "Username or password incorrect"),
+				})
+			}
+		}
+	}
+}
+
+func (c *HandleController) MakeLogoutFunc() func(context *gin.Context) {
+	return func(context *gin.Context) {
+		ClearAuth(context)
+		context.Redirect(http.StatusTemporaryRedirect, LogoutSuccessUrl)
+	}
+}
+
+func (c *HandleController) MakeIndexFunc() func(context *gin.Context) {
 	return func(context *gin.Context) {
 		context.HTML(http.StatusOK, "index.html", gin.H{
 			"version":                      c.Version,
+			"showExit":                     strings.TrimSpace(c.CommonInfo.User) != "" && strings.TrimSpace(c.CommonInfo.Pwd) != "",
 			"FrpsPanel":                    ginI18n.MustGetMessage(context, "Frps Panel"),
 			"User":                         ginI18n.MustGetMessage(context, "User"),
 			"Token":                        ginI18n.MustGetMessage(context, "Token"),
@@ -292,6 +235,7 @@ func (c *HandleController) MakeLangFunc() func(context *gin.Context) {
 			"Proxies":               ginI18n.MustGetMessage(context, "Proxies"),
 			"NotSet":                ginI18n.MustGetMessage(context, "Not Set"),
 			"Proxy":                 ginI18n.MustGetMessage(context, "Proxy"),
+			"TokenInvalid":          ginI18n.MustGetMessage(context, "Token invalid"),
 		})
 	}
 }
@@ -722,12 +666,10 @@ func (c *HandleController) MakeProxyFunc() func(context *gin.Context) {
 		requestUrl := protocol + host + ":" + strconv.Itoa(port) + context.Param("serverApi")
 		request, _ := http.NewRequest("GET", requestUrl, nil)
 		username := c.CommonInfo.DashboardUser
-		if len(strings.TrimSpace(username)) != 0 {
-			password := c.CommonInfo.DashboardPwd
-			userAndPwd := []byte(username + ":" + password)
-			authorization := "Basic " + base64.StdEncoding.EncodeToString(userAndPwd)
-			request.Header.Add("Authorization", authorization)
-			log.Printf("Proxy to %s with Authorization %s", requestUrl, authorization)
+		password := c.CommonInfo.DashboardPwd
+		if len(strings.TrimSpace(username)) != 0 && len(strings.TrimSpace(password)) != 0 {
+			request.SetBasicAuth(username, password)
+			log.Printf("Proxy to %s", requestUrl)
 		}

 		response, err := client.Do(request)
--- a/pkg/server/controller/handler.go
+++ b/pkg/server/controller/handler.go
@@ -3,61 +3,11 @@ package controller
 import (
 	"fmt"
 	plugin "github.com/fatedier/frp/pkg/plugin/server"
-	"github.com/gin-gonic/gin"
-	"gopkg.in/ini.v1"
 	"log"
-	"os"
-	"path/filepath"
 	"strconv"
 	"strings"
 )

-type HandleController struct {
-	CommonInfo CommonInfo
-	Tokens     map[string]TokenInfo
-	Ports      map[string][]string
-	Domains    map[string][]string
-	Subdomains map[string][]string
-	ConfigFile string
-	IniFile    *ini.File
-	Version    string
-}
-
-func NewHandleController(config *HandleController) *HandleController {
-	return config
-}
-
-func (c *HandleController) Register(rootDir string, engine *gin.Engine) {
-	assets := filepath.Join(rootDir, "assets")
-	_, err := os.Stat(assets)
-	if err != nil && !os.IsExist(err) {
-		assets = "./assets"
-	}
-
-	engine.Delims("${", "}")
-	engine.LoadHTMLGlob(filepath.Join(assets, "templates/*"))
-	engine.POST("/handler", c.MakeHandlerFunc())
-
-	var group *gin.RouterGroup
-	if len(c.CommonInfo.User) != 0 {
-		group = engine.Group("/", gin.BasicAuthForRealm(gin.Accounts{
-			c.CommonInfo.User: c.CommonInfo.Pwd,
-		}, "Restricted"))
-	} else {
-		group = engine.Group("/")
-	}
-	group.Static("/static", filepath.Join(assets, "static"))
-	group.GET("/", c.MakeManagerFunc())
-	group.GET("/lang.json", c.MakeLangFunc())
-	group.GET("/tokens", c.MakeQueryTokensFunc())
-	group.POST("/add", c.MakeAddTokenFunc())
-	group.POST("/update", c.MakeUpdateTokensFunc())
-	group.POST("/remove", c.MakeRemoveTokensFunc())
-	group.POST("/disable", c.MakeDisableTokensFunc())
-	group.POST("/enable", c.MakeEnableTokensFunc())
-	group.GET("/proxy/*serverApi", c.MakeProxyFunc())
-}
-
 func (c *HandleController) HandleLogin(content *plugin.LoginContent) plugin.Response {
 	token := content.Metas["token"]
 	user := content.User
--- a/pkg/server/controller/register.go
+++ b/pkg/server/controller/register.go
@@ -0,0 +1,58 @@
+package controller
+
+import (
+	"github.com/gin-gonic/gin"
+	"gopkg.in/ini.v1"
+	"os"
+	"path/filepath"
+)
+
+type HandleController struct {
+	CommonInfo CommonInfo
+	Tokens     map[string]TokenInfo
+	Ports      map[string][]string
+	Domains    map[string][]string
+	Subdomains map[string][]string
+	ConfigFile string
+	IniFile    *ini.File
+	Version    string
+}
+
+func NewHandleController(config *HandleController) *HandleController {
+	return config
+}
+
+func (c *HandleController) Register(rootDir string, engine *gin.Engine) {
+	assets := filepath.Join(rootDir, "assets")
+	_, err := os.Stat(assets)
+	if err != nil && !os.IsExist(err) {
+		assets = "./assets"
+	}
+
+	engine.Delims("${", "}")
+	engine.LoadHTMLGlob(filepath.Join(assets, "templates/*"))
+	engine.POST("/handler", c.MakeHandlerFunc())
+	engine.Static("/static", filepath.Join(assets, "static"))
+	engine.GET("/lang.json", c.MakeLangFunc())
+	engine.GET(LoginUrl, c.MakeLoginFunc())
+	engine.POST(LoginUrl, c.MakeLoginFunc())
+	engine.GET(LogoutUrl, c.MakeLogoutFunc())
+
+	var group *gin.RouterGroup
+	if len(c.CommonInfo.User) != 0 {
+		//group = engine.Group("/", gin.BasicAuthForRealm(gin.Accounts{
+		//	c.CommonInfo.User: c.CommonInfo.Pwd,
+		//}, "Restricted"))
+		group = engine.Group("/", c.BasicAuth())
+	} else {
+		group = engine.Group("/")
+	}
+	group.GET("/", c.MakeIndexFunc())
+	group.GET("/tokens", c.MakeQueryTokensFunc())
+	group.POST("/add", c.MakeAddTokenFunc())
+	group.POST("/update", c.MakeUpdateTokensFunc())
+	group.POST("/remove", c.MakeRemoveTokensFunc())
+	group.POST("/disable", c.MakeDisableTokensFunc())
+	group.POST("/enable", c.MakeEnableTokensFunc())
+	group.GET("/proxy/*serverApi", c.MakeProxyFunc())
+}
--- a/pkg/server/controller/variables.go
+++ b/pkg/server/controller/variables.go
@@ -0,0 +1,106 @@
+package controller
+
+import (
+	"regexp"
+)
+
+const (
+	Success          = 0
+	ParamError       = 1
+	UserExist        = 2
+	SaveError        = 3
+	UserFormatError  = 4
+	TokenFormatError = 5
+	FrpServerError   = 6
+
+	SessionName      = "GOSESSION"
+	AuthName         = "_PANEL_AUTH"
+	LoginUrl         = "/login"
+	LoginSuccessUrl  = "/"
+	LogoutUrl        = "/logout"
+	LogoutSuccessUrl = "/login"
+)
+
+var (
+	UserFormatReg    = regexp.MustCompile("^\\w+$")
+	TokenFormatReg   = regexp.MustCompile("^[\\w!@#$%^&*()]+$")
+	TrimAllSpaceReg  = regexp.MustCompile("[\\n\\t\\r\\s]")
+	TrimBreakLineReg = regexp.MustCompile("[\\n\\t\\r]")
+)
+
+type Response struct {
+	Msg string `json:"msg"`
+}
+
+type HTTPError struct {
+	Code int
+	Err  error
+}
+
+type CommonInfo struct {
+	PluginAddr    string
+	PluginPort    int
+	User          string
+	Pwd           string
+	KeepTime      int
+	DashboardTLS  bool
+	DashboardAddr string
+	DashboardPort int
+	DashboardUser string
+	DashboardPwd  string
+}
+
+type TokenInfo struct {
+	User       string `json:"user" form:"user"`
+	Token      string `json:"token" form:"token"`
+	Comment    string `json:"comment" form:"comment"`
+	Ports      string `json:"ports" from:"ports"`
+	Domains    string `json:"domains" from:"domains"`
+	Subdomains string `json:"subdomains" from:"subdomains"`
+	Status     bool   `json:"status" form:"status"`
+}
+
+type TokenResponse struct {
+	Code  int         `json:"code"`
+	Msg   string      `json:"msg"`
+	Count int         `json:"count"`
+	Data  []TokenInfo `json:"data"`
+}
+
+type OperationResponse struct {
+	Success bool   `json:"success"`
+	Code    int    `json:"code"`
+	Message string `json:"message"`
+}
+
+type ProxyResponse struct {
+	OperationResponse
+	Data string `json:"data"`
+}
+
+type TokenSearch struct {
+	TokenInfo
+	Page  int `form:"page"`
+	Limit int `form:"limit"`
+}
+
+type TokenUpdate struct {
+	Before TokenInfo `json:"before"`
+	After  TokenInfo `json:"after"`
+}
+
+type TokenRemove struct {
+	Users []TokenInfo `json:"users"`
+}
+
+type TokenDisable struct {
+	TokenRemove
+}
+
+type TokenEnable struct {
+	TokenDisable
+}
+
+func (e *HTTPError) Error() string {
+	return e.Err.Error()
+}
--- a/pkg/server/server.go
+++ b/pkg/server/server.go
@@ -7,6 +7,8 @@ import (
 	"fmt"
 	"frps-panel/pkg/server/controller"
 	ginI18n "github.com/gin-contrib/i18n"
+	"github.com/gin-contrib/sessions"
+	"github.com/gin-contrib/sessions/cookie"
 	"github.com/gin-gonic/gin"
 	"golang.org/x/text/language"
 	"log"
@@ -171,6 +173,15 @@ func GinI18nLocalize(rootDir string) gin.HandlerFunc {
 func (s *Server) initHTTPServer() error {
 	gin.SetMode(gin.ReleaseMode)
 	engine := gin.New()
+	authStore := cookie.NewStore([]byte("frps-panel"))
+	authStore.Options(sessions.Options{
+		Secure:   true,
+		HttpOnly: false,
+		SameSite: 4,
+		Path:     "/",
+		MaxAge:   s.cfg.CommonInfo.KeepTime,
+	})
+	engine.Use(sessions.Sessions(controller.SessionName, authStore))
 	engine.Use(GinI18nLocalize(s.rootDir))
 	s.s = &http.Server{
 		Handler: engine,
--- a/screenshots/login.png
+++ b/screenshots/login.png
Author	SHA1	Message	Date
yanghuanglin	c182e17abb	add login page screenshots	2023-09-14 13:11:37 +08:00
yanghuanglin	f41672a613	update package script	2023-09-14 13:05:54 +08:00
yanghuanglin	8eb72831c1	store auth information with session	2023-09-14 12:45:21 +08:00
杨黄林	79bbf4a39c	new login page	2023-09-13 23:23:37 +08:00
杨黄林	09401aae46	remove option dashboard_tls	2023-09-13 20:27:24 +08:00
杨黄林	c0bce28529	Update README.md	2023-09-13 16:36:42 +08:00
杨黄林	1780913228	Update README.md	2023-09-13 16:35:41 +08:00
杨黄林	3c0f1e53aa	Update README_zh.md	2023-09-13 16:35:18 +08:00
杨黄林	65123ada6a	Update README_zh.md	2023-09-13 16:34:55 +08:00
杨黄林	21cf6b9c8b	Update README.md	2023-09-13 16:34:04 +08:00
杨黄林	655fced1ce	Update README_zh.md	2023-09-13 16:31:47 +08:00
杨黄林	bf56c9ead9	Update README.md	2023-09-13 16:31:10 +08:00
杨黄林	d8c991883c	http basic auth by jq(not complete)	2023-09-12 17:39:25 +08:00
杨黄林	0df98345d5	add new login (not complete)	2023-09-11 22:59:23 +08:00
杨黄林	60f4c75d4b	code optimize	2023-09-11 22:27:49 +08:00
杨黄林	c7ee259531	proxy list sort by name	2023-09-11 22:04:14 +08:00