add logout feature (#1301)

* add logout feature

* fix bug, optimize display

* optimize logout display

* keep Logs ui to logout

---------

Co-authored-by: luo.pengcheng <luo.pengcheng@ikasinfo.com>

main.go

@@ -190,6 +190,7 @@ func runWebServer() error {
 	http.HandleFunc("/logs", web.Auth(web.Logs))
 	http.HandleFunc("/clearLog", web.Auth(web.ClearLog))
 	http.HandleFunc("/webhookTest", web.Auth(web.WebhookTest))
+	http.HandleFunc("/logout", web.Auth(web.Logout))
 
 	util.Log("监听 %s", *listen)
 

static/common.css

@@ -227,4 +227,31 @@ main {
     line-height: 0;
     text-align: center;
     font-size: 16px;
-}
+}
+
+.badge {
+    margin-right: 20px; /* 给版本号添加右侧间距 */
+}
+
+.action-button {
+    display: inline-block;
+    padding: 6px 12px;
+    font-size: 14px;
+    color: white;
+    border: 1px solid white;
+    border-radius: 8px;
+    background-color: transparent;
+    text-align: center;
+    text-decoration: none;
+}
+
+.action-button:hover,
+.action-button:visited,
+.action-button:active,
+.action-button:focus {
+    color: white;
+    border-color: white;
+    background-color: transparent;
+    text-decoration: none;
+    outline: none;
+}

static/constant.js

@@ -232,6 +232,7 @@ const I18N_MAP = {
     "NetInterfaceEmptyHelp": '<span style="color: red">No available network card found</span>',
     "Login": 'Login',
     "LoginInit": 'Login and configure as an administrator account',
+    "Logout": 'Logout',
   },
   'zh-cn': {
     'Logs': '日志',
@@ -298,5 +299,6 @@ const I18N_MAP = {
     "NetInterfaceEmptyHelp": '<span style="color: red">没有找到可用的网卡</span>',
     "Login": '登录',
     "LoginInit": '登录并配置为管理员账号',
+    "Logout": '注销',
   }
 };

web/logout.go

@@ -0,0 +1,23 @@
+package web
+
+import (
+	"net/http"
+	"time"
+)
+
+func Logout(w http.ResponseWriter, r *http.Request) {
+	// 创建一个过期的 Cookie 来清除客户端的身份认证 Cookie
+	expiredCookie := http.Cookie{
+		Name:     cookieName, // 假设你的身份验证使用的是名为 "auth" 的 Cookie
+		Value:    "",
+		Path:     "/",
+		Expires:  time.Unix(0, 0), // 设置为过期时间
+		MaxAge:   -1,              // 立即删除该 Cookie
+		HttpOnly: true,
+	}
+	// 设置过期的 Cookie
+	http.SetCookie(w, &expiredCookie)
+
+	// 重定向用户到登录页面
+	http.Redirect(w, r, "./login", http.StatusFound)
+}

web/writing.html

@@ -30,11 +30,7 @@
           >
             <strong>DDNS-GO</strong>
           </a>
-          <button
-            data-i18n="Logs"
-            class="btn btn-info btn-sm"
-            id="logsBtn"
-          >
+          <button data-i18n="Logs" class="action-button logout-button" id="logsBtn">
             Logs
           </button>
           <span
@@ -42,6 +38,9 @@
             id="themeButton"
           ></span>
           <span class="badge badge-secondary">{{.Version}}</span>
+          <a href="./logout" class="action-button logout-button" data-i18n="Logout">
+              Logout
+          </a>
         </div>
       </div>
     </header>
@@ -102,7 +101,7 @@
 
           <form id="formDnsConf">
             <div class="portlet">
-              <h5 
+              <h5
                 data-i18n="DNS Provider"
                 class="portlet__head"
                 id="dnsProvider"
@@ -480,7 +479,7 @@
                       id="Ipv6Reg"
                       aria-describedby="Ipv6RegHelp"
                     />
-                    <small 
+                    <small
                       data-i18n_html="regHelp"
                       id="Ipv6RegHelp"
                       class="form-text text-muted"
@@ -513,7 +512,7 @@
 
           <form id="formGlobal">
             <div class="portlet">
-              <h5 
+              <h5
                 data-i18n="Others"
                 class="portlet__head"
               >Others</h5>
@@ -561,7 +560,7 @@
                     />
                     <small
                       data-i18n_html="accountHelp"
-                      id="UsernameHelp" 
+                      id="UsernameHelp"
                       class="form-text text-muted"
                     ></small>
                   </div>
@@ -750,7 +749,7 @@
       TTL: "",
     };
   </script>
-  
+
   <!-- 表单相关 -->
   <script>
     // 生成DNS选择项