fix: replace session handler with jwt authorization

web/src/store/chat.js

@@ -1,6 +1,6 @@
 import Storage from 'good-storage'
 
-const CHAT_CONFIG_KEY = "chat_config"
+const CHAT_CONFIG_KEY = process.env.VUE_APP_KEY_PREFIX + "chat_config"
 
 export function getChatConfig() {
     return Storage.get(CHAT_CONFIG_KEY)

web/src/store/session.js

@@ -1,15 +1,16 @@
-/* eslint-disable no-constant-condition */
-
 import {randString} from "@/utils/libs";
+import Storage from "good-storage";
 
 /**
  * storage handler
  */
 
-const SessionIDKey = 'SESSION_ID';
+const SessionIDKey = process.env.VUE_APP_KEY_PREFIX + 'SESSION_ID';
+const UserTokenKey = process.env.VUE_APP_KEY_PREFIX + "Authorization";
+const AdminTokenKey = process.env.VUE_APP_KEY_PREFIX + "Admin-Authorization"
 
 export function getSessionId() {
-    let sessionId = sessionStorage.getItem(SessionIDKey)
+    let sessionId = Storage.get(SessionIDKey)
     if (!sessionId) {
         sessionId = randString(42)
         setSessionId(sessionId)
@@ -17,10 +18,34 @@ export function getSessionId() {
     return sessionId
 }
 
-export function removeLoginUser() {
-    sessionStorage.removeItem(SessionIDKey)
+export function removeSessionId() {
+    Storage.remove(SessionIDKey)
 }
 
 export function setSessionId(sessionId) {
-    sessionStorage.setItem(SessionIDKey, sessionId)
+    Storage.set(SessionIDKey, sessionId)
+}
+
+export function getUserToken() {
+    return Storage.get(UserTokenKey)
+}
+
+export function setUserToken(token) {
+    Storage.set(UserTokenKey, token)
+}
+
+export function removeUserToken() {
+    Storage.remove(UserTokenKey)
+}
+
+export function getAdminToken() {
+    return Storage.get(AdminTokenKey)
+}
+
+export function setAdminToken(token) {
+    Storage.set(AdminTokenKey, token)
+}
+
+export function removeAdminToken() {
+    Storage.remove(AdminTokenKey)
 }

web/src/store/system.js

@@ -1,6 +1,6 @@
 import Storage from "good-storage";
 
-const MOBILE_THEME = "MOBILE_THEME"
+const MOBILE_THEME = process.env.VUE_APP_KEY_PREFIX + "MOBILE_THEME"
 
 export function getMobileTheme() {
     return Storage.get(MOBILE_THEME) ? Storage.get(MOBILE_THEME) : 'light'

web/src/utils/http.js

@@ -1,5 +1,5 @@
 import axios from 'axios'
-import {getSessionId} from "@/store/session";
+import {getAdminToken, getSessionId, getUserToken} from "@/store/session";
 
 axios.defaults.timeout = 10000
 axios.defaults.baseURL = process.env.VUE_APP_API_HOST
@@ -11,6 +11,8 @@ axios.interceptors.request.use(
     config => {
         // set token
         config.headers['Chat-Token'] = getSessionId();
+        config.headers['Authorization'] = getUserToken();
+        config.headers['Admin-Authorization'] = getAdminToken();
         return config
     }, error => {
         return Promise.reject(error)

web/src/views/ChatPlus.vue

@@ -271,7 +271,7 @@ import 'highlight.js/styles/a11y-dark.css'
 import {dateFormat, isMobile, randString, removeArrayItem, renderInputText, UUID} from "@/utils/libs";
 import {ElMessage, ElMessageBox} from "element-plus";
 import hl from "highlight.js";
-import {getSessionId, removeLoginUser} from "@/store/session";
+import {getSessionId, getUserToken, removeUserToken} from "@/store/session";
 import {httpGet, httpPost} from "@/utils/http";
 import {useRouter} from "vue-router";
 import Clipboard from "clipboard";
@@ -319,9 +319,6 @@ onMounted(() => {
   checkSession().then((user) => {
     loginUser.value = user
     isLogin.value = true
-    if (user.chat_config?.model !== '') {
-      modelID.value = user.chat_config.model
-    }
     // 加载角色列表
     httpGet(`/api/role/list?user_id=${user.id}`).then((res) => {
       roles.value = res.data;
@@ -400,7 +397,7 @@ const newChat = function () {
     chat_id: "",
     icon: icon,
     role_id: roleId.value,
-    model: modelID.value,
+    model_id: modelID.value,
     title: '',
     edit: false,
     removing: false,
@@ -419,7 +416,7 @@ const changeChat = function (chat) {
   activeChat.value = chat
   newChatItem.value = null;
   roleId.value = chat.role_id;
-  modelID.value = chat.model;
+  modelID.value = chat.model_id;
   showStopGenerate.value = false;
   showReGenerate.value = false;
   connect(chat.chat_id, chat.role_id)
@@ -510,7 +507,7 @@ const connect = function (chat_id, role_id) {
       host = 'ws://' + location.host;
     }
   }
-  const _socket = new WebSocket(host + `/api/chat/new?session_id=${_sessionId}&role_id=${role_id}&chat_id=${chat_id}&model_id=${modelID.value}`);
+  const _socket = new WebSocket(host + `/api/chat/new?session_id=${_sessionId}&role_id=${role_id}&chat_id=${chat_id}&model_id=${modelID.value}&token=${getUserToken()}`);
   _socket.addEventListener('open', () => {
     chatData.value = []; // 初始化聊天数据
     previousText.value = '';
@@ -740,7 +737,7 @@ const clearAllChats = function () {
 const logout = function () {
   activelyClose.value = true;
   httpGet('/api/user/logout').then(() => {
-    removeLoginUser();
+    removeUserToken();
     router.push('login');
   }).catch(() => {
     ElMessage.error('注销失败！');

web/src/views/Login.vue

@@ -56,6 +56,7 @@ import {useRouter} from "vue-router";
 import FooterBar from "@/components/FooterBar.vue";
 import {isMobile} from "@/utils/libs";
 import {checkSession} from "@/action/session";
+import {setUserToken} from "@/store/session";
 
 const router = useRouter();
 const title = ref('ChatGPT-PLUS 用户登录');
@@ -87,7 +88,8 @@ const login = function () {
     return ElMessage.error('请输入密码');
   }
 
-  httpPost('/api/user/login', {username: username.value.trim(), password: password.value.trim()}).then(() => {
+  httpPost('/api/user/login', {username: username.value.trim(), password: password.value.trim()}).then((res) => {
+    setUserToken(res.data)
     if (isMobile()) {
       router.push('/mobile')
     } else {

web/src/views/admin/Login.vue

@@ -46,6 +46,7 @@ import {httpPost} from "@/utils/http";
 import {ElMessage} from "element-plus";
 import {useRouter} from "vue-router";
 import FooterBar from "@/components/FooterBar.vue";
+import {setAdminToken} from "@/store/session";
 
 const router = useRouter();
 const title = ref('ChatGPT Plus Admin');
@@ -68,7 +69,8 @@ const login = function () {
     return ElMessage.error('请输入密码');
   }
 
-  httpPost('/api/admin/login', {username: username.value.trim(), password: password.value.trim()}).then((res) => {
+  httpPost('/api/admin/login', {username: username.value.trim(), password: password.value.trim()}).then(res => {
+    setAdminToken(res.data)
     router.push("/admin")
   }).catch((e) => {
     ElMessage.error('登录失败，' + e.message)

web/src/views/mobile/ChatSession.vue

@@ -200,7 +200,7 @@ const connect = function (chat_id, role_id) {
       host = 'ws://' + location.host;
     }
   }
-  const _socket = new WebSocket(host + `/api/chat/new?session_id=${_sessionId}&role_id=${role_id}&chat_id=${chat_id}&model_id=${model}`);
+  const _socket = new WebSocket(host + `/api/chat/new?session_id=${_sessionId}&role_id=${role_id}&chat_id=${chat_id}&model_id=${model}&token=${getUserToken()}`);
   _socket.addEventListener('open', () => {
     loading.value = false
     previousText.value = '';