From 06c053228c0f78161f9758945c53285d30fb583b Mon Sep 17 00:00:00 2001 From: go0p Date: Mon, 10 Feb 2025 18:05:12 +0800 Subject: [PATCH] fix --- public/background.js | 10 +- public/db/db.js | 6 +- public/proxy.js | 132 +++++++++--------- public/proxy/options.js | 6 +- public/proxy/proxy-logs.js | 34 +---- src/index.jsx | 7 - src/index.tsx | 17 +++ .../components/ProxySettings/index.tsx | 18 +-- src/pages/options.tsx | 5 +- tsconfig.json | 6 +- webpack.config.js | 15 +- 11 files changed, 126 insertions(+), 130 deletions(-) delete mode 100644 src/index.jsx create mode 100644 src/index.tsx diff --git a/public/background.js b/public/background.js index 2d1d708..7297ea0 100644 --- a/public/background.js +++ b/public/background.js @@ -2,7 +2,7 @@ import {ActionType, injectScriptAndSendMessage, WebSocketManager} from './socket import { setupProxyHandlers } from './proxy.js'; import { ProxyActionType } from './types/action.js'; -console.info("Chrome Extenstion Background is loaded") +console.info("Chrome Extension Background is loaded"); const websocketManager = new WebSocketManager(); @@ -12,13 +12,17 @@ setupProxyHandlers(); // 添加点击事件处理 chrome.action.onClicked.addListener((tab) => { // 打开侧边栏 - chrome.sidePanel.open({ windowId: tab.windowId }); + chrome.sidePanel.open({windowId: tab.windowId}).catch(error => { + console.error('Error opening side panel:', error); + }); }); -// 可选：设置默认打开状态 +// 设置默认打开状态 chrome.sidePanel.setOptions({ enabled: true, path: 'index.html' +}).catch(error => { + console.error('Error setting side panel options:', error); }); chrome.runtime.onMessage.addListener(function (msg, sender, sendResponse) { diff --git a/public/db/db.js b/public/db/db.js index 98d1088..56c91d6 100644 --- a/public/db/db.js +++ b/public/db/db.js @@ -3,9 +3,13 @@ class Database { this.DB_NAME = 'yaklang_extension'; this.DB_VERSION = 1; this.stores = { + // 代理日志存储 PROXY_LOGS: 'proxy_logs', + // 代理配置列表存储 PROXY_CONFIGS: 'proxy_configs', + // 当前代理配置存储 CURRENT_PROXY: 'current_proxy', + // 代理认证信息存储 PROXY_AUTH: 'proxy_auth' }; } @@ -55,7 +59,7 @@ class Database { return tx.objectStore(storeName); } - // 通用的 CRUD 操作 + // CRUD 操作 async get(storeName, key) { const store = await this.getStore(storeName); return new Promise((resolve, reject) => { diff --git a/public/proxy.js b/public/proxy.js index e052de0..d3353e7 100644 --- a/public/proxy.js +++ b/public/proxy.js @@ -1,8 +1,8 @@ -import { ProxySettings } from './proxy/proxy-settings.js'; -import { ProxyAuth } from './proxy/proxy-auth.js'; -import { ProxyActionType } from './types/action.js'; -import { proxyLogs } from './proxy/proxy-logs.js'; -import { proxyStore } from './db/proxy-store.js'; +import {ProxySettings} from './proxy/proxy-settings.js'; +import {ProxyAuth} from './proxy/proxy-auth.js'; +import {ProxyActionType} from './types/action.js'; +import {proxyLogs} from './proxy/proxy-logs.js'; +import {proxyStore} from './db/proxy-store.js'; // 修改代理状态获取函数为 Promise 形式 function getProxySettings() { @@ -17,7 +17,7 @@ async function handleSetProxyConfig(config, sendResponse) { if (config.proxyType === 'direct') { await new Promise((resolve) => { chrome.proxy.settings.set({ - value: { mode: "direct" }, + value: {mode: "direct"}, scope: 'regular' }, resolve); }); @@ -41,12 +41,12 @@ async function handleSetProxyConfig(config, sendResponse) { await proxyStore.saveProxyConfigs(updatedConfigs); console.log('Direct connection set successfully'); - sendResponse({ success: true }); + sendResponse({success: true}); } else { console.error('Failed to set direct connection'); - sendResponse({ - success: false, - error: '无法设置直接连接' + sendResponse({ + success: false, + error: '无法设置直接连接' }); } return; @@ -54,9 +54,9 @@ async function handleSetProxyConfig(config, sendResponse) { // 处理代理服务器的情况 if (!config || !config.host || !config.port) { - sendResponse({ - success: false, - error: '无效的代理配置' + sendResponse({ + success: false, + error: '无效的代理配置' }); return; } @@ -81,9 +81,9 @@ async function handleSetProxyConfig(config, sendResponse) { }); const settings = await getProxySettings(); - const isSuccess = settings.value.mode === "fixed_servers" && - settings.value.rules.singleProxy.host === config.host && - settings.value.rules.singleProxy.port === parseInt(config.port); + const isSuccess = settings.value.mode === "fixed_servers" && + settings.value.rules.singleProxy.host === config.host && + settings.value.rules.singleProxy.port === parseInt(config.port); if (isSuccess) { await proxyStore.setCurrentProxy({ @@ -99,19 +99,19 @@ async function handleSetProxyConfig(config, sendResponse) { await proxyStore.saveProxyConfigs(updatedConfigs); console.log('Proxy successfully set:', settings.value); - sendResponse({ success: true }); + sendResponse({success: true}); } else { console.error('Proxy settings verification failed'); - sendResponse({ - success: false, - error: '代理设置验证失败' + sendResponse({ + success: false, + error: '代理设置验证失败' }); } } catch (error) { console.error('Error setting proxy:', error); - sendResponse({ - success: false, - error: error.message || '设置代理时发生错误' + sendResponse({ + success: false, + error: error.message || '设置代理时发生错误' }); } } @@ -126,7 +126,7 @@ async function handleClearProxyConfig(sendResponse) { await new Promise((resolve) => { chrome.proxy.settings.set({ - value: { mode: "system" }, + value: {mode: "system"}, scope: 'regular' }, resolve); }); @@ -147,19 +147,19 @@ async function handleClearProxyConfig(sendResponse) { if (isSuccess) { console.log('Proxy successfully cleared'); - sendResponse({ success: true }); + sendResponse({success: true}); } else { console.error('Failed to clear proxy settings'); - sendResponse({ - success: false, - error: '无法清除代理设置' + sendResponse({ + success: false, + error: '无法清除代理设置' }); } } catch (error) { console.error('Error clearing proxy:', error); - sendResponse({ - success: false, - error: error.message || '清除代理时发生错误' + sendResponse({ + success: false, + error: error.message || '清除代理时发生错误' }); } } @@ -168,7 +168,7 @@ async function handleGetProxyStatus(sendResponse) { try { const settings = await getProxySettings(); const currentProxy = await proxyStore.getCurrentProxy(); - + const status = { enabled: settings.value.mode === "fixed_servers", config: currentProxy || null, @@ -200,7 +200,7 @@ function setupProxyRequestListener() { }); // 不需要返回值 }, - { urls: [""] } + {urls: [""]} ); // 监听请求错误 @@ -211,7 +211,7 @@ function setupProxyRequestListener() { console.error('Error in proxy error listener:', error); }); }, - { urls: [""] } + {urls: [""]} ); } @@ -249,55 +249,55 @@ export function setupProxyHandlers() { // 消息监听器 chrome.runtime.onMessage.addListener((msg, sender, sendResponse) => { console.log("Proxy message:", msg); - + switch (msg.action) { case ProxyActionType.SET_PROXY_CONFIG: handleSetProxyConfig(msg.config, sendResponse); return true; - + case ProxyActionType.CLEAR_PROXY_CONFIG: handleClearProxyConfig(sendResponse); return true; - + case ProxyActionType.GET_PROXY_STATUS: handleGetProxyStatus(sendResponse); return true; case ProxyActionType.GET_PROXY_LOGS: proxyLogs.getLogs().then(logs => { - sendResponse({ + sendResponse({ success: true, - data: logs + data: logs }); }).catch(error => { - sendResponse({ - success: false, - error: error.message + sendResponse({ + success: false, + error: error.message }); }); return true; case ProxyActionType.CLEAR_PROXY_LOGS: proxyLogs.clearLogs().then(() => { - sendResponse({ success: true }); + sendResponse({success: true}); }).catch(error => { - sendResponse({ - success: false, - error: error.message + sendResponse({ + success: false, + error: error.message }); }); return true; case ProxyActionType.GET_PROXY_CONFIGS: proxyStore.getProxyConfigs().then(configs => { - sendResponse({ + sendResponse({ success: true, - data: configs + data: configs }); }).catch(error => { - sendResponse({ - success: false, - error: error.message + sendResponse({ + success: false, + error: error.message }); }); return true; @@ -305,12 +305,13 @@ export function setupProxyHandlers() { case ProxyActionType.ADD_PROXY_CONFIG: proxyStore.getProxyConfigs().then(async configs => { const newConfigs = [...configs, msg.config]; - await proxyStore.saveProxyConfigs(newConfigs); - sendResponse({ success: true }); + ProxyActionType + proxyStore.saveProxyConfigs(newConfigs); + sendResponse({success: true}); }).catch(error => { - sendResponse({ - success: false, - error: error.message + sendResponse({ + success: false, + error: error.message }); }); return true; @@ -321,23 +322,23 @@ export function setupProxyHandlers() { if (!msg.configs || !Array.isArray(msg.configs)) { throw new Error('无效的配置数据'); } - + console.log('Updating proxy configs:', msg.configs); await proxyStore.saveProxyConfigs(msg.configs); - + // 获取最新的配置 const updatedConfigs = await proxyStore.getProxyConfigs(); console.log('Configs updated successfully:', updatedConfigs); - + // 发送响应 - sendResponse({ + sendResponse({ success: true, data: updatedConfigs }); } catch (error) { console.error('Error updating proxy configs:', error); - sendResponse({ - success: false, + sendResponse({ + success: false, error: error.message || '更新代理配置失败' }); } @@ -351,10 +352,11 @@ export function setupProxyHandlers() { try { // 确保默认配置存在 await ProxySettings.setDefaultConfigs(); - + // 清除之前的代理设置 - await handleClearProxyConfig(() => {}); - + await handleClearProxyConfig(() => { + }); + // 设置认证监听 await ProxyAuth.setupAuthListener(); } catch (error) { diff --git a/public/proxy/options.js b/public/proxy/options.js index 5c9fc3a..53b1100 100644 --- a/public/proxy/options.js +++ b/public/proxy/options.js @@ -163,7 +163,5 @@ function showError(message) { // 5秒后自动移除错误信息 setTimeout(() => { errorDiv.remove(); - }, 5000); -} - -// ... 其他代码保持不变 \ No newline at end of file + }, 3000); +} \ No newline at end of file diff --git a/public/proxy/proxy-logs.js b/public/proxy/proxy-logs.js index b187dff..885b3bf 100644 --- a/public/proxy/proxy-logs.js +++ b/public/proxy/proxy-logs.js @@ -2,33 +2,6 @@ import { proxyStore } from '../db/proxy-store.js'; // 日志数据库管理 class ProxyLogs { - constructor() { - this.DB_NAME = 'proxy_extension'; - this.STORE_NAME = 'proxy_logs'; - this.DB_VERSION = 1; - this.MAX_LOGS = 1000; // 最多保存1000条日志 - } - - async initDB() { - return new Promise((resolve, reject) => { - const request = indexedDB.open(this.DB_NAME, this.DB_VERSION); - - request.onerror = () => reject(request.error); - request.onsuccess = () => resolve(request.result); - - request.onupgradeneeded = (event) => { - const db = event.target.result; - if (!db.objectStoreNames.contains(this.STORE_NAME)) { - const store = db.createObjectStore(this.STORE_NAME, { keyPath: 'id' }); - // 创建索引 - store.createIndex('timestamp', 'timestamp'); - store.createIndex('resourceType', 'resourceType'); - store.createIndex('status', 'status'); - } - }; - }); - } - async getResourceType(details) { try { // 首先检查请求类型 @@ -174,9 +147,4 @@ class ProxyLogs { } } -// 导出实例而不是直接使用顶层 await -export const proxyLogs = new ProxyLogs(); - -// 移除这些顶层 await 语句 -// await proxyStore.addLog({...}); -// const logs = await proxyStore.getLogs(); \ No newline at end of file +export const proxyLogs = new ProxyLogs(); \ No newline at end of file diff --git a/src/index.jsx b/src/index.jsx deleted file mode 100644 index 0e48d00..0000000 --- a/src/index.jsx +++ /dev/null @@ -1,7 +0,0 @@ -import React from 'react'; -import ReactDOM from 'react-dom/client'; -import './index.css'; -import App from './App'; - -const root = ReactDOM.createRoot(document.getElementById('root')); -root.render(); \ No newline at end of file diff --git a/src/index.tsx b/src/index.tsx new file mode 100644 index 0000000..47aec8d --- /dev/null +++ b/src/index.tsx @@ -0,0 +1,17 @@ +import React from 'react'; +import { createRoot } from 'react-dom/client'; +import App from './App'; + +// 获取根元素 +const container = document.getElementById('root'); +if (!container) throw new Error('Failed to find the root element'); + +// 创建根 +const root = createRoot(container); + +// 渲染应用 +root.render( + + + +); \ No newline at end of file diff --git a/src/pages/OptionsPage/components/ProxySettings/index.tsx b/src/pages/OptionsPage/components/ProxySettings/index.tsx index fdbc5a3..e06ea3a 100644 --- a/src/pages/OptionsPage/components/ProxySettings/index.tsx +++ b/src/pages/OptionsPage/components/ProxySettings/index.tsx @@ -1,5 +1,5 @@ -import React from 'react'; -import { Card, Input, Space, Button, Select, InputNumber, Form, Table } from 'antd'; +import React, { useRef } from 'react'; +import { Card, Input, Space, Button, Select, InputNumber, Form, Table, Tooltip, Popover } from 'antd'; import type { ColumnsType } from 'antd/es/table'; import { DeleteOutlined, PlusOutlined } from '@ant-design/icons'; import { ProxyConfig } from '@/types/proxy'; @@ -143,16 +143,16 @@ export const ProxySettings: React.FC = ({ } ]; + const buttonRef = useRef(null); + return (
- + + + diff --git a/tsconfig.json b/tsconfig.json index 3715958..cafb253 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -19,10 +19,12 @@ "typeRoots": [ "./node_modules/@types", "./src/types" - ] + ], + "skipLibCheck": true, + "lib": ["dom", "dom.iterable", "esnext"] }, "include": [ - "./src/**/*", + "./src/**/*" ], "exclude": [ "node_modules" diff --git a/webpack.config.js b/webpack.config.js index 52c312b..9e0f509 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -7,7 +7,7 @@ const webpack = require('webpack'); module.exports = { mode: 'development', // 设置模式为开发模式 entry: { - main: './src/index.jsx', + main: './src/index.tsx', options: './src/pages/options.tsx' }, output: { @@ -52,9 +52,16 @@ module.exports = { use: ['style-loader', 'css-loader'] }, { - test: /\.tsx?$/, // 匹配TS和TSX文件 - use: 'ts-loader', - exclude: /node_modules/, + test: /\.tsx?$/, + use: [ + { + loader: 'ts-loader', + options: { + transpileOnly: true // 添加这个选项可以加快编译速度 + } + } + ], + exclude: /node_modules/ }, { test: /\.(js|jsx)$/, // 匹配JS和JSX文件