@easyai-canvas/canvas-plugin-sdk 0.1.5 → 0.1.6

package/dist/customer-main.js

@@ -80,7 +80,8 @@ async function studioCatalog() {
                 nodes: entry.manifest.contributes.nodes?.length ?? 0,
                 actions: entry.manifest.contributes.actions?.length ?? 0,
                 package: packaged.downloads[entry.manifest.id] ? { mode: 'download' } : null,
-                buildKey: createHash('sha256').update(JSON.stringify({ revision: catalog.revision, entry })).digest('hex'),
+                buildKey: createHash('sha256').update(JSON.stringify({ instanceId: catalog.instanceId,
+                    entry, bundleDigest: bundle?.digest, cssDigest: bundle?.cssDigest })).digest('hex'),
             };
         }),
     };
@@ -249,7 +250,7 @@ const server = createServer(async (request, response) => {
             }
             if (method === 'POST' && path === '/studio/open') {
                 const input = await body(request);
-                send(response, 200, await studio.openDebugSession(String(input.pluginId ?? '')));
+                send(response, 200, await studio.openDebugSession(typeof input.pluginId === 'string' && input.pluginId ? input.pluginId : undefined));
                 return;
             }
             if (method === 'POST' && path === '/studio/embed-ticket') {

package/dist/studio/index.html

@@ -316,14 +316,14 @@ dialog::backdrop { background: #30384266; }
   </div>
   <div id="notice" class="notice" role="status" hidden></div>
   <dialog id="panel" aria-labelledby="panel-title">
-    <div class="dialog-head"><div><h2 id="panel-title">插件管理</h2><p>选择插件，查看配置并进入画布调试</p></div><button id="close" type="button" aria-label="关闭管理面板"><svg viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" aria-hidden="true"><path d="M4.5 4.5 15.5 15.5M15.5 4.5 4.5 15.5"/></svg></button></div>
+    <div class="dialog-head"><div><h2 id="panel-title">插件管理</h2><p>已启用插件会同时出现在调试画布，选择插件可查看配置</p></div><button id="close" type="button" aria-label="关闭管理面板"><svg viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" aria-hidden="true"><path d="M4.5 4.5 15.5 15.5M15.5 4.5 4.5 15.5"/></svg></button></div>
     <div class="dialog-body">
       <aside class="plugin-sidebar" aria-labelledby="target-title"><div class="section-heading"><h3 id="target-title">本地插件</h3><span id="plugin-count" class="activity-count">0 个</span></div><p>选择插件后在右侧管理</p><div id="plugin-list" class="plugin-list" role="radiogroup" aria-labelledby="target-title"></div></aside>
       <div class="plugin-detail"><p id="detail-empty" class="detail-empty" hidden>暂无插件。请在本地服务中注册插件。</p><div id="plugin-detail-content" class="plugin-detail-content">
         <div class="detail-head"><div><h3 id="detail-name">插件</h3><code id="detail-id"></code></div><span id="detail-status" class="status-badge" role="status">检查中</span></div>
         <div class="detail-meta"><span id="detail-nodes">0 个节点</span><span id="detail-actions">0 个操作</span><span id="detail-package">插件包不可用</span></div>
-        <div class="plugin-actions"><button id="open-plugin" type="button"><svg viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M3 10h11m-4-4 4 4-4 4M16 4h2v12h-2"/></svg><span>在画布中调试</span></button><button id="download-package" type="button" disabled><svg viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M10 2.5v10m-3.5-3.5L10 12.5 13.5 9M3.5 14v2.5h13V14"/></svg><span id="download-label">下载插件包</span></button></div><p id="package-note" class="package-note" role="status" aria-live="polite"></p>
-        <div class="configuration-section" aria-labelledby="configuration-title"><h4 id="configuration-title">插件配置</h4><p>配置仅保存在本地开发服务中。</p><div id="no-config" class="no-config" hidden>此插件无需配置，可以直接调试或下载插件包。</div><form id="plugin-config" class="plugin-config" hidden><p id="config-status" role="status" aria-live="polite"></p><div id="config-fields"></div><div class="config-actions"><button type="submit">保存并启用</button><button id="config-check" type="button">检查配置</button></div></form></div>
+        <div class="plugin-actions"><button id="open-plugin" type="button"><svg viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M3 10h11m-4-4 4 4-4 4M16 4h2v12h-2"/></svg><span>返回调试画布</span></button><button id="download-package" type="button" disabled><svg viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M10 2.5v10m-3.5-3.5L10 12.5 13.5 9M3.5 14v2.5h13V14"/></svg><span id="download-label">下载插件包</span></button></div><p id="package-note" class="package-note" role="status" aria-live="polite"></p>
+        <div class="configuration-section" aria-labelledby="configuration-title"><h4 id="configuration-title">插件配置</h4><p>配置仅保存在本地开发服务中。</p><div id="no-config" class="no-config" hidden>此插件无需配置，可以在画布中使用或下载插件包。</div><form id="plugin-config" class="plugin-config" hidden><p id="config-status" role="status" aria-live="polite"></p><div id="config-fields"></div><div class="config-actions"><button type="submit">保存并启用</button><button id="config-check" type="button">检查配置</button></div></form></div>
         <div class="secondary-panels"><details><summary>连接与构建 <span id="panel-status" class="status-badge" role="status">正在连接</span></summary><div class="panel-content"><dl class="session-summary"><div><dt>开发服务</dt><dd id="connection">—</dd></div><div><dt>当前构建</dt><dd id="build">—</dd></div><div><dt>调试画布</dt><dd id="project">—</dd></div></dl><span id="active-plugin" class="section-context" hidden></span><div class="sdk-card" hidden><strong>画布插件 SDK</strong><p class="sdk-message" role="status" aria-live="polite"></p><button class="sdk-action" type="button" hidden>升级 SDK</button></div><details class="technical-details"><summary>查看连接详情</summary><dl><dt>连接 ID</dt><dd id="connection-id">—</dd><dt>构建摘要</dt><dd id="build-full">—</dd><dt>项目 ID</dt><dd id="project-id">—</dd></dl></details></div></details><details><summary>最近活动 <span id="activity-count" class="activity-count">0 条</span></summary><div class="panel-content"><div id="log" class="activity-list" role="log" aria-label="调试活动" aria-live="polite"></div></div></details></div>
       </div></div>
     </div>
@@ -535,6 +535,10 @@ dialog::backdrop { background: #30384266; }
       $('dock-expand').addEventListener('click', () => { manuallyCollapsed = false; expandedOverDialog = canvasDialogOpen; renderDock(); });
       const chosen = () => catalog?.plugins.find(item => item.id === selected);
       const panelPlugin = () => catalog?.plugins.find(item => item.id === panelSelected);
+      const activePluginId = () => session?.pluginId || preparedSession?.pluginId || selected;
+      const hasNewBuild = () => (session?.plugins || (session ? [{ pluginId: session.pluginId, fingerprint: session.fingerprint }] : []))
+        .some(item => item.active !== false && catalog?.plugins.find(plugin => plugin.id === item.pluginId)?.buildKey !== item.fingerprint) ||
+        Boolean(session && catalog?.plugins.some(plugin => plugin.enabled && !session.plugins?.some(item => item.pluginId === plugin.id && item.active)));
       let configFormKey = '', configFeedback = null;
       function renderConfig() {
         const plugin = panelPlugin();
@@ -599,27 +603,27 @@ dialog::backdrop { background: #30384266; }
       }
       const url = () => {
         const address = new URL('/developer/plugin-debug', catalog.platformOrigin);
-        address.searchParams.set('pluginId', selected);
+        address.searchParams.set('pluginId', activePluginId());
         address.searchParams.set('connectionId', catalog.connectionId);
         if (preparedSession?.sessionId) address.searchParams.set('sessionId', preparedSession.sessionId);
         return address.toString();
       };
       function render() {
         const plugin = chosen();
-        $('plugin-name').textContent = plugin?.name || '插件调试';
+        $('plugin-name').textContent = catalog?.plugins?.length ? `${catalog.plugins.filter(item => item.enabled).length} 个插件 · 调试画布` : '插件调试画布';
         const building = catalog?.devBuild?.state;
-        $('state').textContent = building === 'error' ? '构建失败' : building === 'building' ? '正在构建' : plugin?.configurationRequired ? '待配置' : frameFailed ? '画布加载失败' : busy ? (session ? '正在刷新' : '正在打开画布') : session ? (!session.active ? '会话已失效' : plugin?.buildKey === session.fingerprint ? '已连接' : '发现新构建') : '等待画布';
-        $('dot').className = `dot ${building === 'error' || frameFailed ? 'error' : building === 'building' || plugin?.configurationRequired ? 'warning' : session ? !session.active ? 'error' : plugin?.buildKey === session.fingerprint ? 'ready' : 'warning' : ''}`;
+        $('state').textContent = building === 'error' ? '构建失败' : building === 'building' ? '正在构建' : frameFailed ? '画布加载失败' : busy ? (session ? '正在刷新' : '正在打开画布') : session ? (!session.active ? '会话已失效' : hasNewBuild() ? '发现新构建' : '已连接') : '等待画布';
+        $('dot').className = `dot ${building === 'error' || frameFailed ? 'error' : building === 'building' ? 'warning' : session ? !session.active ? 'error' : hasNewBuild() ? 'warning' : 'ready' : ''}`;
         $('refresh').disabled = !session?.active || busy || frameFailed || Boolean(building && building !== 'ready');
         const stateText = $('state').textContent;
         $('panel-status').textContent = stateText;
         $('panel-status').className = `status-badge ${$('dot').classList.contains('error') ? 'error' : $('dot').classList.contains('ready') ? 'ready' : ''}`;
         $('connection').textContent = connectorStatus?.phase === 'connected' ? '已连接 · 本机' : '未连接';
-        $('active-plugin').textContent = plugin?.name || '';
-        $('build').textContent = building === 'error' ? '构建失败' : building === 'building' ? '构建中' : plugin?.buildKey ? plugin.buildKey.slice(0, 8) : '等待构建';
+        $('active-plugin').textContent = catalog?.plugins.filter(item => item.enabled).map(item => item.name).join('、') || '';
+        $('build').textContent = building === 'error' ? '构建失败' : building === 'building' ? '构建中' : `${catalog?.plugins.filter(item => item.enabled).length || 0} 个插件`;
         $('project').textContent = session?.active ? '私人调试画布' : session ? '会话已失效' : '等待打开';
         $('connection-id').textContent = catalog?.connectionId || '—';
-        $('build-full').textContent = plugin?.buildKey || '—';
+        $('build-full').textContent = catalog?.plugins.filter(item => item.enabled).map(item => `${item.name}: ${item.buildKey}`).join('\n') || '—';
         $('project-id').textContent = session?.projectId || '—';
         renderPluginList();
         renderConfig();
@@ -633,7 +637,7 @@ dialog::backdrop { background: #30384266; }
         $('detail-package').textContent = inspected?.package ? '插件包可下载' : '插件包不可用';
         $('detail-status').textContent = inspected?.configurationRequired ? '待配置' : inspected?.enabled ? '已启用' : '已停用';
         $('detail-status').className = `status-badge ${inspected?.configurationRequired ? '' : inspected?.enabled ? 'ready' : 'error'}`;
-        $('open-plugin').disabled = !inspected?.enabled || busy || packageDownloading;
+        $('open-plugin').disabled = busy || packageDownloading;
         $('download-package').disabled = !inspected?.package || packageDownloading;
         $('download-package').setAttribute('aria-busy', String(packageDownloading));
         $('download-label').textContent = packageDownloading ? '正在准备…' : inspected?.package?.mode === 'build' ? '打包并下载' : '下载插件包';
@@ -649,13 +653,13 @@ dialog::backdrop { background: #30384266; }
         $('empty-text').textContent = '正在打开调试画布…';
         canvasDialogOpen = false; expandedOverDialog = false; renderDock(); render();
         try {
-          const response = await fetch('/studio/open', { method: 'POST', headers: { 'content-type': 'application/json' }, body: JSON.stringify({ pluginId: selected }) });
+          const response = await fetch('/studio/open', { method: 'POST', headers: { 'content-type': 'application/json' }, body: '{}' });
           const next = await response.json();
           if (!response.ok) throw new Error(next.message || next.error || '调试画布创建失败');
           preparedSession = next;
         } catch (error) { busy = false; frameLoading = false; frameFailed = true; $('empty-text').textContent = error.message; $('retry').hidden = false; show(error.message); log(error.message); render(); return; }
         frame.src = url();
-        log(`打开真实画布：${selected}`);
+        log('打开全部插件的调试画布');
         readyTimer = setTimeout(() => {
           if (!session) {
             busy = false; frameLoading = false; frameFailed = true; $('retry').hidden = false;
@@ -695,7 +699,7 @@ dialog::backdrop { background: #30384266; }
         if (event.origin === window.location.origin && event.data?.type === 'plugin-debug-auth-complete') { void loadConnectionStatus(); return; }
         if (!catalog || event.origin !== catalog.platformOrigin || event.source !== frame.contentWindow) return;
         const data = event.data;
-        if (!data || typeof data !== 'object' || data.protocol !== protocol || data.pluginId !== selected) return;
+        if (!data || typeof data !== 'object' || data.protocol !== protocol || data.pluginId !== activePluginId()) return;
         if (data.type === 'bootstrap.request' && preparedSession?.sessionId === data.sessionId &&
             typeof data.codeChallenge === 'string' && /^[A-Za-z0-9_-]{43,128}$/.test(data.codeChallenge)) {
           void (async () => {
@@ -704,7 +708,7 @@ dialog::backdrop { background: #30384266; }
                 body: JSON.stringify({ debugSessionId: data.sessionId, codeChallenge: data.codeChallenge }) });
               const issued = await response.json();
               if (!response.ok) throw new Error(issued.message || issued.error || '画布登录失败');
-              frame.contentWindow.postMessage({ protocol, type: 'bootstrap.ticket', pluginId: selected,
+              frame.contentWindow.postMessage({ protocol, type: 'bootstrap.ticket', pluginId: activePluginId(),
                 sessionId: data.sessionId, ticket: issued.ticket }, catalog.platformOrigin);
             } catch (error) { show(error.message); log(error.message); }
           })();
@@ -726,6 +730,10 @@ dialog::backdrop { background: #30384266; }
         if (data.type === 'status' && data.status?.sessionId === session.sessionId) { session = data.status; if (!session.active) show('调试会话已失效，请在管理菜单中重新连接。'); render(); return; }
         if (data.type === 'refreshing' && data.requestId === waiting) { busy = true; log('正在保存画布并检查新构建'); render(); }
         if (data.type === 'refreshResult' && data.requestId === waiting) {
+          if (data.status?.sessionId !== session.sessionId) {
+            waiting = null; show('插件列表已更新，正在重新打开调试画布。', false);
+            void connect(); return;
+          }
           session = data.status; waiting = null; busy = Boolean(data.changed); frameLoading = Boolean(data.changed); show(data.changed ? '新构建已启用，正在重新加载画布…' : '当前已经是最新构建。', false); log(data.changed ? '构建已更新，画布正在重载' : '当前构建没有变化');
           if (data.changed) $('empty-text').textContent = '正在加载新构建…';
           if (data.changed) readyTimer = setTimeout(() => {
@@ -740,7 +748,7 @@ dialog::backdrop { background: #30384266; }
       $('refresh').addEventListener('click', () => {
         if (!session || busy) return;
         waiting = crypto.randomUUID(); busy = true;
-        frame.contentWindow.postMessage({ protocol, type: 'refresh', sessionId: session.sessionId, pluginId: selected, requestId: waiting }, catalog.platformOrigin);
+        frame.contentWindow.postMessage({ protocol, type: 'refresh', sessionId: session.sessionId, pluginId: activePluginId(), requestId: waiting }, catalog.platformOrigin);
         render();
       });
       function openPanel(forConfiguration = false) {
@@ -789,8 +797,7 @@ dialog::backdrop { background: #30384266; }
         } catch (error) { configFeedback = { pluginId: plugin.id, message: error.message || '配置检查失败' }; $('config-status').textContent = configFeedback.message; }
       });
       $('open-plugin').addEventListener('click', () => {
-        if (!panelPlugin()?.enabled || busy) return;
-        selected = panelSelected; show(''); panel.close(); connect();
+        panel.close();
       });
       $('download-package').addEventListener('click', async () => {
         const plugin = panelPlugin();

package/dist/studio/remote-connector.d.ts

@@ -42,7 +42,7 @@ export declare class RemoteStudioConnector {
     }>;
     private post;
     private renewAccessToken;
-    openDebugSession(pluginId: string): Promise<{
+    openDebugSession(pluginId?: string): Promise<{
         sessionId: string;
         projectId: string;
         connectionId: string;

package/dist/studio/remote-connector.js

@@ -119,7 +119,7 @@ export class RemoteStudioConnector {
         if (!this.ticket || this.phase !== 'connected')
             throw new Error('请先连接画布平台');
         await this.renewAccessToken();
-        return this.post(`/canvas-workflow/plugin-debug-connectors/${this.ticket.connectionId}/open`, { pluginId }, true);
+        return this.post(`/canvas-workflow/plugin-debug-connectors/${this.ticket.connectionId}/open`, pluginId ? { pluginId } : {}, true);
     }
     async createEmbedTicket(debugSessionId, codeChallenge) {
         if (!this.ticket || this.phase !== 'connected')

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@easyai-canvas/canvas-plugin-sdk",
-  "version": "0.1.5",
+  "version": "0.1.6",
   "description": "EasyAI 画布插件开发工具与运行时",
   "type": "module",
   "engines": {

package/tools/build-plugin-package.mjs

@@ -27,9 +27,11 @@ export async function buildPluginPackage({
       },
     },
   });
-  const plugin = (
-    await import(pathToFileURL(resolve(directory, 'server/plugin.mjs')).href)
-  ).default;
+  const serverModule = resolve(directory, 'server/plugin.mjs');
+  const serverBytes = await readFile(serverModule);
+  const moduleUrl = new URL(pathToFileURL(serverModule).href);
+  moduleUrl.searchParams.set('build', createHash('sha256').update(serverBytes).digest('hex'));
+  const plugin = (await import(moduleUrl.href)).default;
   if (!plugin?.manifest) throw new Error(`插件入口 ${serverEntry} 必须默认导出 definePlugin(...)`);
   await build({
     configFile: false,