add streamable

Author: purpleroc

.cursor/rules/rule.mdc

@@ -0,0 +1,8 @@
+---
+description: 安全内置规则
+globs:
+alwaysApply: true
+---
+
+- 界面相关操作，均需要适配中英双语
+- 不需要额外编写测试、验证脚本

manifest.json

@@ -1,7 +1,7 @@
 {
   "manifest_version": 3,
   "name": "MCP Security Inspector",
-  "version": "2.0.2",
+  "version": "2.0.4",
   "description": "Model Security Inspector - 用于对MCP工具、资源、Prompt进行安全分析(MCP server tools, resources and prompts security analysis)",
   "action": {
     "default_title": "MCP Security Inspector"

package.json

@@ -1,6 +1,6 @@
 {
   "name": "mcp-security-inspector",
-  "version": "2.0.2",
+  "version": "2.0.4",
   "description": "Chrome扩展 - MCP协议安全性检测工具",
   "type": "module",
   "scripts": {
@@ -11,7 +11,7 @@
     "clean-dist": "rm -rf dist/public",
     "preview": "vite preview",
     "type-check": "tsc --noEmit",
-    "package": "npm run build:extension && cd dist && zip -r ../mcp-security-inspector-v2.0.2.zip ."
+    "package": "npm run build:extension && cd dist && zip -r ../mcp-security-inspector-v2.0.4.zip ."
   },
   "dependencies": {
     "@ant-design/icons": "^5.2.6",

public/manifest.json

@@ -1,7 +1,7 @@
 {
   "manifest_version": 3,
   "name": "MCP Security Inspector",
-  "version": "2.0.2",
+  "version": "2.0.4",
   "description": "Model Security Inspector - 用于对MCP工具、资源、Prompt进行安全分析(MCP server tools, resources and prompts security analysis)",
   "action": {
     "default_title": "MCP Security Inspector"

src/App.tsx

@@ -14,7 +14,7 @@ import { MCPServerConfig } from './types/mcp';
 import { useI18n } from './hooks/useI18n';
 
 // 版本号
-const APP_VERSION = '2.0.2';
+const APP_VERSION = '2.0.4';
 
 const { Header, Content, Sider } = Layout;
 

src/components/MCPExplorer.tsx

@@ -22,11 +22,12 @@ import {
   MessageOutlined, 
   PlayCircleOutlined,
   InfoCircleOutlined,
-  ExclamationCircleOutlined
+  ExclamationCircleOutlined,
+  ReloadOutlined
 } from '@ant-design/icons';
 import { useSelector, useDispatch } from 'react-redux';
 import { RootState } from '../store';
-import { callTool, readResource, getPrompt } from '../store/mcpSlice';
+import { callTool, readResource, getPrompt, setTools, setPrompts, setResources, setResourceTemplates } from '../store/mcpSlice';
 import { MCPTool, MCPResource, MCPPrompt, SecurityRiskLevel } from '../types/mcp';
 import { useI18n } from '../hooks/useI18n';
 
@@ -60,6 +61,7 @@ const MCPExplorer: React.FC = () => {
   const [toolErrors, setToolErrors] = useState<Record<string, string>>({});
   const [resourceErrors, setResourceErrors] = useState<Record<string, string>>({});
   const [promptErrors, setPromptErrors] = useState<Record<string, string>>({});
+  const [refreshing, setRefreshing] = useState(false);
 
   // 监听连接状态变化，切换服务器时清空本地状态
   useEffect(() => {
@@ -99,7 +101,7 @@ const MCPExplorer: React.FC = () => {
       const result = await dispatch(callTool({ tool: selectedTool, parameters: toolParams }) as any).unwrap();
       setToolResults(prev => ({ ...prev, [selectedTool.name]: result.result }));
       setToolErrors(prev => ({ ...prev, [selectedTool.name]: '' }));
-      message.success(t.success.connected);
+      message.success(t.success.toolCallSuccess);
     } catch (error) {
       setToolErrors(prev => ({ ...prev, [selectedTool.name]: String(error) }));
       setToolResults(prev => ({ ...prev, [selectedTool.name]: null }));
@@ -166,7 +168,7 @@ const MCPExplorer: React.FC = () => {
       const resourceKey = selectedResource.name || selectedResource.uri || (selectedResource as any).uriTemplate;
       setResourceResults(prev => ({ ...prev, [resourceKey]: result.result }));
       setResourceErrors(prev => ({ ...prev, [resourceKey]: '' }));
-      message.success(t.success.connected);
+      message.success(t.success.resourceReadSuccess);
     } catch (error) {
       console.error('资源读取错误:', error);
       // 改进资源键的生成逻辑
@@ -185,14 +187,53 @@ const MCPExplorer: React.FC = () => {
       const result = await dispatch(getPrompt({ prompt: selectedPrompt, parameters: promptParams }) as any).unwrap();
       setPromptResults(prev => ({ ...prev, [selectedPrompt.name]: result.result }));
       setPromptErrors(prev => ({ ...prev, [selectedPrompt.name]: '' }));
-      message.success(t.success.connected);
+      message.success(t.success.promptGetSuccess);
     } catch (error) {
       setPromptErrors(prev => ({ ...prev, [selectedPrompt.name]: String(error) }));
       setPromptResults(prev => ({ ...prev, [selectedPrompt.name]: null }));
       message.error(`${t.errors.promptGetFailed}: ${error}`);
     }
   };
 
+  // 刷新组件列表
+  const handleRefresh = async () => {
+    if (refreshing) return;
+    
+    setRefreshing(true);
+    try {
+      // 手动重新获取组件列表
+      const { mcpClient } = await import('../services/mcpClient');
+      
+      // 重新获取所有组件
+      const [tools, prompts, resources, resourceTemplates] = await Promise.allSettled([
+        mcpClient.listTools(),
+        mcpClient.listPrompts(),
+        mcpClient.listResources(),
+        mcpClient.listResourceTemplates()
+      ]);
+      
+      // 更新Redux store
+      if (tools.status === 'fulfilled') {
+        dispatch(setTools(tools.value));
+      }
+      if (prompts.status === 'fulfilled') {
+        dispatch(setPrompts(prompts.value));
+      }
+      if (resources.status === 'fulfilled') {
+        dispatch(setResources(resources.value));
+      }
+      if (resourceTemplates.status === 'fulfilled') {
+        dispatch(setResourceTemplates(resourceTemplates.value));
+      }
+      
+      message.success(t.explorer.refreshSuccess);
+    } catch (error) {
+      message.error(t.explorer.refreshFailed + ': ' + error);
+    } finally {
+      setRefreshing(false);
+    }
+  };
+
   // 从URI模板中提取参数
   const extractParamsFromUri = (uri: string): Record<string, { type: string; description?: string }> => {
     const params: Record<string, { type: string; description?: string }> = {};

src/i18n/en-US.ts

@@ -123,6 +123,7 @@ export const enUS: TranslationKey = {
     combinedMode: 'Combined Authentication Mode',
     combinedModeDesc: 'You can configure multiple authentication methods simultaneously, and the system will automatically combine and apply these authentication configurations',
     enableApiKey: 'Enable API Key Authentication',
+    authEnabled: 'Enable Authentication',
     enableUrlParams: 'Enable URL Parameter Authentication',
     enableCustomHeaders: 'Enable Custom Header Authentication',
   },
@@ -135,6 +136,9 @@ export const enUS: TranslationKey = {
     protocolVersion: 'Protocol Version',
     capabilities: 'Server Capabilities',
     instructions: 'Instructions',
+    refresh: 'Refresh',
+    refreshSuccess: 'Component list refreshed',
+    refreshFailed: 'Refresh failed',
   },
 
   tools: {
@@ -229,6 +233,9 @@ export const enUS: TranslationKey = {
     itemDeleted: 'Record deleted successfully',
     exportSuccess: 'Export successful',
     importSuccess: 'Import successful',
+    toolCallSuccess: 'Tool call successful',
+    resourceReadSuccess: 'Resource read successful',
+    promptGetSuccess: 'Prompt get successful',
   },
 
   llm: {

src/i18n/index.ts

@@ -130,6 +130,7 @@ export interface TranslationKey {
     removeParam: string;
     combinedMode: string;
     combinedModeDesc: string;
+    authEnabled: string;
     enableApiKey: string;
     enableUrlParams: string;
     enableCustomHeaders: string;
@@ -144,6 +145,9 @@ export interface TranslationKey {
     protocolVersion: string;
     capabilities: string;
     instructions: string;
+    refresh: string;
+    refreshSuccess: string;
+    refreshFailed: string;
   };
 
   // 工具面板
@@ -927,6 +931,9 @@ export interface TranslationKey {
     itemDeleted: string;
     exportSuccess: string;
     importSuccess: string;
+    toolCallSuccess: string;
+    resourceReadSuccess: string;
+    promptGetSuccess: string;
   };
 
   // 应用信息

src/i18n/zh-CN.ts

@@ -122,6 +122,7 @@ export const zhCN: TranslationKey = {
     removeParam: '删除参数',
     combinedMode: '组合认证模式',
     combinedModeDesc: '可以同时配置多种认证方式，系统会自动组合应用这些认证配置',
+    authEnabled: '启用认证',
     enableApiKey: '启用 API Key 认证',
     enableUrlParams: '启用 URL 参数认证',
     enableCustomHeaders: '启用自定义请求头认证',
@@ -135,6 +136,9 @@ export const zhCN: TranslationKey = {
     protocolVersion: '协议版本',
     capabilities: '服务器能力',
     instructions: '使用说明',
+    refresh: '刷新',
+    refreshSuccess: '组件列表已刷新',
+    refreshFailed: '刷新失败',
   },
 
   tools: {
@@ -229,6 +233,9 @@ export const zhCN: TranslationKey = {
     itemDeleted: '记录删除成功',
     exportSuccess: '导出成功',
     importSuccess: '导入成功',
+    toolCallSuccess: '工具调用成功',
+    resourceReadSuccess: '资源读取成功',
+    promptGetSuccess: '提示获取成功',
   },
 
   llm: {