重新修改了chat

web/src/App.js

@@ -20,6 +20,7 @@ import Redemption from './pages/Redemption';
 import TopUp from './pages/TopUp';
 import Log from './pages/Log';
 import Chat from './pages/Chat';
+import Chat2Link from './pages/Chat2Link'; //新增
 import { Layout } from '@douyinfe/semi-ui';
 import Midjourney from './pages/Midjourney';
 import Pricing from './pages/Pricing/index.js';
@@ -255,6 +256,17 @@ function App() {
               </Suspense>
             }
           />
+          {/* 方便使用外链... */}
+          <Route
+            path='/chat2link'
+            element={
+              <PrivateRoute>
+                <Suspense fallback={<Loading></Loading>}>
+                    <Chat2Link />
+                </Suspense>
+              </PrivateRoute>
+            }
+          />
           <Route path='*' element={<NotFound />} />
         </Routes>
       </Layout.Content>

web/src/components/fetchTokenKeys.js

@@ -0,0 +1,68 @@
+// src/hooks/useTokenKeys.js
+import { useEffect, useState } from 'react';
+import { API, showError } from '../helpers';
+
+async function fetchTokenKeys() {
+  try {
+    const response = await API.get('/api/token/?p=0&size=999');
+    const { success, data } = response.data;
+    if (success) {
+      const activeTokens = data.filter((token) => token.status === 1);
+      return activeTokens.map((token) => token.key);
+    } else {
+      throw new Error('Failed to fetch token keys');
+    }
+  } catch (error) {
+    console.error("Error fetching token keys:", error);
+    return [];
+  }
+}
+
+function getServerAddress() {
+  let status = localStorage.getItem('status');
+  let serverAddress = '';
+
+  if (status) {
+    try {
+      status = JSON.parse(status);
+      serverAddress = status.server_address || '';
+    } catch (error) {
+      console.error("Failed to parse status from localStorage:", error);
+    }
+  }
+
+  if (!serverAddress) {
+    serverAddress = window.location.origin;
+  }
+
+  return serverAddress;
+}
+
+export function useTokenKeys() {
+  const [keys, setKeys] = useState([]);
+  const [chatLink, setChatLink] = useState('');
+  const [serverAddress, setServerAddress] = useState('');
+  const [isLoading, setIsLoading] = useState(true);
+
+  useEffect(() => {
+    const loadAllData = async () => {
+      const fetchedKeys = await fetchTokenKeys();
+      if (fetchedKeys.length === 0) {
+        showError('当前没有可用的启用令牌，请确认是否有令牌处于启用状态！');
+        window.location.href = '/token';
+      }
+      setKeys(fetchedKeys);
+      setIsLoading(false);
+
+      const link = localStorage.getItem('chat_link');
+      setChatLink(link);
+
+      const address = getServerAddress();
+      setServerAddress(address);
+    };
+
+    loadAllData();
+  }, []);
+
+  return { keys, chatLink, serverAddress, isLoading };
+}

web/src/pages/Chat/index.js

@@ -1,72 +1,9 @@
-import React, { useEffect, useState } from 'react';
+import React from 'react';
-import { API, showError } from '../../helpers';
+import { useTokenKeys } from '../../components/fetchTokenKeys';
 import {  Layout } from '@douyinfe/semi-ui';
 
-// 获取 Token Keys 的异步函数，过滤掉非启用状态的令牌
+const ChatPage = () => {
-async function fetchTokenKeys() {
+  const { keys, chatLink, serverAddress, isLoading } = useTokenKeys();
-  try {
-    const response = await API.get('/api/token/?p=0&size=999');
-    const { success, data } = response.data;
-    if (success) {
-      // 过滤已启用状态的令牌
-      const activeTokens = data.filter((token) => token.status === 1);
-      return activeTokens.map((token) => token.key);
-    } else {
-      throw new Error('Failed to fetch token keys');
-    }
-  } catch (error) {
-    console.error("Error fetching token keys:", error);
-    return [];
-  }
-}
-
-function getServerAddress() {
-  let status = localStorage.getItem('status');
-  let serverAddress = '';
-
-  if (status) {
-    try {
-      status = JSON.parse(status);
-      serverAddress = status.server_address || '';
-    } catch (error) {
-      console.error("Failed to parse status from localStorage:", error);
-    }
-  }
-
-  if (!serverAddress) {
-    serverAddress = window.location.origin;
-  }
-
-  return serverAddress;
-}
-
-const TokenKeysPage = () => {
-  const [keys, setKeys] = useState([]);
-  const [chatLink, setChatLink] = useState('');
-  const [serverAddress, setServerAddress] = useState('');
-  const [isLoading, setIsLoading] = useState(true);
-  
-  useEffect(() => {
-    const loadAllData = async () => {
-      const fetchedKeys = await fetchTokenKeys();
-      if (fetchedKeys.length === 0) {
-        // showError('当前没有可用的启用令牌，请确认是否有令牌处于启用状态！');
-        setTimeout(() => {
-          window.location.href = '/token';
-        }, 1500); // 延迟 1.5 秒后跳转
-      }
-      setKeys(fetchedKeys);
-      setIsLoading(false); 
-
-      const link = localStorage.getItem('chat_link');
-      setChatLink(link);
-
-      const address = getServerAddress();
-      setServerAddress(address);
-    };
-
-    loadAllData();
-  }, []);
 
   const comLink = (key) => {
     if (!chatLink || !serverAddress || !key) return '';
@@ -75,7 +12,6 @@ const TokenKeysPage = () => {
 
   const iframeSrc = keys.length > 0 ? comLink(keys[0]) : '';
 
-  // 生成链接
   return !isLoading && iframeSrc ? (
     <iframe
       src={iframeSrc}
@@ -94,7 +30,6 @@ const TokenKeysPage = () => {
       </Layout>
     </div>
   );
-
 };
 
-export default TokenKeysPage;
+export default ChatPage;

web/src/pages/Chat2Link/index.js

@@ -0,0 +1,26 @@
+import React from 'react';
+import { useTokenKeys } from '../../components/fetchTokenKeys';
+
+const chat2page = () => {
+  const { keys, chatLink, serverAddress, isLoading } = useTokenKeys();
+
+  const comLink = (key) => {
+    if (!chatLink || !serverAddress || !key) return '';
+    return `${chatLink}/#/?settings={"key":"sk-${key}","url":"${encodeURIComponent(serverAddress)}"}`;
+  };
+
+  if (keys.length > 0) {
+    const redirectLink = comLink(keys[0]);
+    if (redirectLink) {
+      window.location.href = redirectLink;
+    }
+  }
+
+  return (
+    <div>
+        <h3>正在加载，请稍候...</h3>
+    </div>
+  );
+};
+
+export default chat2page;