@kevisual/api 0.0.12 → 0.0.15

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kevisual/api",
-  "version": "0.0.12",
+  "version": "0.0.15",
   "description": "",
   "main": "mod.ts",
   "scripts": {
@@ -18,12 +18,12 @@
   "keywords": [],
   "author": "abearxiong <xiongxiao@xiongxiao.me> (https://www.xiongxiao.me)",
   "license": "MIT",
-  "packageManager": "pnpm@10.26.2",
+  "packageManager": "pnpm@10.27.0",
   "type": "module",
   "devDependencies": {
     "@kevisual/cache": "^0.0.4",
     "@kevisual/query": "^0.0.33",
-    "@kevisual/router": "^0.0.51",
+    "@kevisual/router": "^0.0.52",
     "@kevisual/types": "^0.0.10",
     "@kevisual/use-config": "^1.0.21",
     "@types/bun": "^1.3.5",
@@ -32,7 +32,7 @@
     "fast-glob": "^3.3.3"
   },
   "dependencies": {
-    "@kevisual/js-filter": "^0.0.2",
+    "@kevisual/js-filter": "^0.0.3",
     "@kevisual/load": "^0.0.6",
     "es-toolkit": "^1.43.0",
     "eventemitter3": "^5.0.1",

package/query/query-proxy/index.ts

@@ -3,39 +3,59 @@ import { QueryRouterServer, Route } from '@kevisual/router/src/route.ts';
 import { filter } from '@kevisual/js-filter'
 import { EventEmitter } from 'eventemitter3';
 
-export type RouterViewItem = RouterViewApi | RouterViewContext | RouterViewWorker;
-export type RouterViewApi = {
+export const RouteTypeList = ['api', 'context', 'worker', 'page'] as const;
+export type RouterViewItem = RouterViewApi | RouterViewContext | RouterViewWorker | RouteViewPage;
+
+type RouteViewBase = {
+  id: string;
   title: string;
   description: string;
+  enabled?: boolean;
+}
+export type RouterViewApi = {
   type: 'api',
   api: {
     url: string,
-    // 已初始化的query实例
+    // 已初始化的query实例，不需要编辑配置
     query?: Query
   }
-}
+} & RouteViewBase;
 
 export type RouterViewContext = {
-  title: string;
-  description: string;
   type: 'context',
   context: {
     key: string,
-    // 从context中获取router
+    // 从context中获取router，不需要编辑配置
     router?: QueryRouterServer
   }
-}
+} & RouteViewBase;
 export type RouterViewWorker = {
-  title: string;
-  description: string;
   type: 'worker',
   worker: {
     type: 'Worker' | 'SharedWorker' | 'serviceWorker',
     url: string,
-    // 已初始化的worker实例
-    worker?: Worker | SharedWorker | ServiceWorker
+    // 已初始化的worker实例，不需要编辑配置
+    worker?: Worker | SharedWorker | ServiceWorker,
+    /**
+     * worker选项
+     * default: { type: 'module' }
+     */
+    workerOptions?: {
+      type: 'module' | 'classic'
+    }
+  }
+} & RouteViewBase;
+
+/**
+ * 注入 js 的url地址，使用importScripts加载
+ */
+export type RouteViewPage = {
+  type: 'page',
+  page: {
+    url: string,
   }
-}
+} & RouteViewBase;
+
 export type RouterViewQuery = {
   id: string,
   query: string,
@@ -72,7 +92,7 @@ export class QueryProxy {
     }
   }
   async initRouterViewQuery() {
-    this.routerViewItems = this.routerViewItems?.map(item => {
+    this.routerViewItems = this.routerViewItems.map(item => {
       if (item.type === 'api' && item.api?.url) {
         const url = item.api.url;
         if (item?.api?.query) return item;
@@ -80,16 +100,19 @@ export class QueryProxy {
       }
       if (item.type === 'worker' && item.worker?.url) {
         let viewItem = item as RouterViewWorker;
+        if (!item.worker?.workerOptions?.type) {
+          item.worker.workerOptions = { ...item.worker.workerOptions, type: 'module' };
+        }
         if (item.worker.worker) {
           return item;
         }
         let worker: Worker | SharedWorker | ServiceWorker | undefined = undefined;
         if (item.worker.type === 'SharedWorker') {
-          worker = new SharedWorker(item.worker.url);
+          worker = new SharedWorker(item.worker.url, item.worker.workerOptions);
           worker.port.start();
         } else if (viewItem.worker.type === 'serviceWorker') {
           if ('serviceWorker' in navigator) {
-            navigator.serviceWorker.register(viewItem.worker.url).then(function (registration) {
+            navigator.serviceWorker.register(viewItem.worker.url, item.worker.workerOptions).then(function (registration) {
               console.debug('注册serviceWorker成功 ', registration.scope);
             }, function (err) {
               console.debug('注册 serviceWorker 失败: ', err);
@@ -98,7 +121,7 @@ export class QueryProxy {
             console.warn('当前浏览器不支持serviceWorker');
           }
         } else {
-          worker = new Worker(viewItem.worker.url);
+          worker = new Worker(viewItem.worker.url, item.worker.workerOptions);
         }
         viewItem['worker']['worker'] = worker;
       }
@@ -114,6 +137,9 @@ export class QueryProxy {
         }
       }
       return item;
+    }).filter(item => {
+      const enabled = item.enabled ?? true;
+      return enabled;
     });
   }
 
@@ -124,21 +150,44 @@ export class QueryProxy {
   async init() {
     const routerViewItems = this.routerViewItems || [];
     if (routerViewItems.length === 0) {
+      // 默认初始化api类型路由
       await this.initApi();
       return;
     }
     for (const item of routerViewItems) {
       switch (item.type) {
         case 'api':
-          this.initApi(item);
+          await this.initApi(item);
           break;
         case 'context':
+          await this.initContext(item);
           break;
         case 'worker':
-          this.initWorker(item);
+          await this.initWorker(item);
+          break;
+        case 'page':
+          await this.initPage(item);
           break;
       }
     }
+    this.emitter.emit('initComplete');
+  }
+  /**
+   * 监听初始化完成
+   * @returns 
+   */
+  async listenInitComplete(): Promise<boolean> {
+    return new Promise((resolve) => {
+      const timer = setTimeout(() => {
+        this.emitter.removeAllListeners('initComplete');
+        resolve(false);
+      }, 3 * 60000); // 3分钟超时
+      const func = () => {
+        clearTimeout(timer);
+        resolve(true);
+      }
+      this.emitter.once('initComplete', func);
+    });
   }
   async initApi(item?: RouterViewApi) {
     const that = this;
@@ -152,12 +201,14 @@ export class QueryProxy {
     for (const r of _list) {
       if (r.path || r.id) {
         console.debug(`注册路由: [${r.path}] ${r?.key}`, 'API');
+        let metadata = r.metadata || {};
+        metadata.viewItem = item;
         this.router.route({
           path: r.path,
           key: r.key || '',
           id: r.id,
           description: r.description,
-          metadata: r.metadata,
+          metadata: metadata,
         }).define(async (ctx) => {
           const msg = { ...ctx.query };
           if (msg.token === undefined && that.token !== undefined) {
@@ -180,12 +231,14 @@ export class QueryProxy {
     const routes = router.getList();
     for (const r of routes) {
       console.debug(`注册路由: [${r.path}] ${r?.key}`, 'Context');
+      let metadata = r.metadata || {};
+      metadata.viewItem = item;
       this.router.route({
         path: r.path,
         key: r.key || '',
         id: r.id,
         description: r.description,
-        metadata: r.metadata,
+        metadata: metadata,
       }).define(async (ctx) => {
         const res = await router.run({ path: r.path, key: r.key, ...ctx.query });
         ctx.forward(res)
@@ -207,14 +260,23 @@ export class QueryProxy {
       console.warn('Worker not initialized');
       return;
     }
-    if (item.worker.type === 'SharedWorker') {
-      const port = (worker as SharedWorker).port;
-      port.onmessage = function (e) {
-        const msg = e.data;
+    const callResponse = (e: MessageEvent) => {
+      const msg = e.data;
+      if (msg.requestId) {
         const requestId = msg.requestId;
         that.emitter.emit(requestId, msg);
-      };
+      } else {
+        that.router.run(msg);
+      }
+    }
+    if (item.worker.type === 'SharedWorker') {
+      const port = (worker as SharedWorker).port;
+      port.onmessage = callResponse;
       port.start();
+    } else if (item.worker.type === 'serviceWorker') {
+      navigator.serviceWorker.addEventListener('message', callResponse);
+    } else {
+      (worker as Worker).onmessage = callResponse;
     }
     const callWorker = async (msg: any, viewItem: RouterViewWorker['worker']): Promise<Result> => {
       const requestId = this.generateId();
@@ -243,6 +305,7 @@ export class QueryProxy {
         });
       });
     }
+
     const res = await callWorker({
       path: "router",
       key: 'list',
@@ -257,12 +320,14 @@ export class QueryProxy {
     for (const r of _list) {
       if (r.path || r.id) {
         console.debug(`注册路由: [${r.path}] ${r?.key}`, 'API');
+        let metadata = r.metadata || {};
+        metadata.viewItem = item;
         this.router.route({
           path: r.path,
           key: r.key || '',
           id: r.id,
           description: r.description,
-          metadata: r.metadata,
+          metadata: metadata,
         }).define(async (ctx) => {
           const msg = { ...ctx.query };
           if (msg.token === undefined && that.token !== undefined) {
@@ -274,6 +339,23 @@ export class QueryProxy {
       }
     }
   }
+  async initPage(item?: RouteViewPage) {
+    if (!item?.page?.url) {
+      console.warn('Page地址未提供');
+      return;
+    }
+    const url = item.page.url;
+    try {
+      if (typeof window !== 'undefined') {
+        await import(url).then((module) => { }).catch((err) => {
+          console.error('引入Page脚本失败:', url, err);
+        });
+      }
+    } catch (e) {
+      console.warn('引入Page脚本失败:', url, e);
+      return;
+    }
+  }
   /**
    * 列出路由
    * @param filter 
@@ -296,6 +378,13 @@ export class QueryProxy {
     }
     return routes;
   }
+  async getViewQuery(viewId: string) {
+    const view = this.views.find(v => v.id === viewId);
+    if (view) {
+      return view.query;
+    }
+    return undefined;
+  }
   /**
    * 运行路由
    * @param msg