nexfep 0.1.2 → 0.1.3

package/README-CN.md

@@ -71,7 +71,7 @@ const win = await pool.createWindow(true, false);
 
 ### 窗口操作
 
-```typescript
+```javascript
 window.show();
 window.hide();
 window.maximize();
@@ -81,11 +81,9 @@ window.setTitle('新标题');
 window.openDevTools();
 ```
 
-### IPC 通信
+### 自定义消息
 
-框架在 WebView 页面加载完成后会自动注入一系列控制函数，建议使用这些注入的函数进行 IPC 通信，而非直接使用 `@webviewjs/webview` 原生包装的 IPC。
-
-#### 发送自定义消息
+#### 发送消息
 
 在页面中通过 `window.postMessage` 发送消息：
 
@@ -112,7 +110,9 @@ pool.onCustomMessage = (window, data) => {
 - `window` — 发送消息的窗口对象
 - `data` — 消息内容，为对象类型（JSON 序列化后会自动通过 `JSON.parse` 转换为对象）
 
-#### 触发自定义事件
+### 自定义事件
+
+#### 触发事件
 
 在页面中通过 `window.invoke` 触发事件：
 
@@ -155,7 +155,44 @@ pool.unhandle('hello', (data) => {
 - `event` — 事件名称，需要和触发事件时的事件名称一致
 - `callback` — 事件处理函数，需要和监听事件时的回调函数一致
 
-#### 窗口控制函数
+### 全局变量
+
+#### 设置变量
+
+在页面中通过 `window.setGlobal` 设置全局变量：
+
+```javascript
+window.setGlobal('hello', 'world');
+```
+
+**参数说明**
+
+- `name` — 全局变量名称
+- `value` — 全局变量值，任意类型的可序列化数据，会被序列化为 JSON 字符串后发送
+
+#### 获取变量
+
+在页面中通过 `window.getGlobal` 获取全局变量：
+
+```javascript
+const value = await window.getGlobal('hello');
+```
+
+**参数说明**
+
+- `name` — 全局变量名称
+
+#### 全局变量Map
+
+在主进程中通过 `WindowPool.global` 获取一个包含所有全局变量的 `Map<string, any>` 对象，可对其进行设置、获取等操作：
+
+```typescript
+const globals = pool.global;
+globals.set('hello', 'world');
+const value = globals.get('hello');
+```
+
+### 窗口控制函数
 
 页面中可直接调用以下注入函数进行窗口控制：
 
@@ -248,6 +285,7 @@ if (window.isNexfepLoadDone) {
 | `createWindow(isShow?, isDecorated?)` | `isShow`: boolean（默认 true）, `isDecorated`: boolean（默认 true） | Promise\<Window> | 创建并获取一个窗口                  |
 | `handle(event, callback)`             | `event`: string, `callback`: (data: string) => void | 无                | 监听指定事件，当收到事件时触发回调函数 |
 | `unhandle(event, callback)`                     | `event`: string, `callback`: (data: string) => void | 无                | 取消监听指定事件回调中的指定函数 |
+| `global`                              | /                                                                          | Map\<string, any> | 全局变量Map，类型为 `Map<string, any>`                         |
 | `closeWindow(window)`                 | `window`: Window                                            | Promise\<void>   | 关闭指定窗口并回收至池中               |
 | `closePool()`                         | 无                                                           | Promise\<void>   | 关闭窗口池，退出应用                 |
 | `mainloop()`                          | 无                                                           | void             | 启动应用主循环，阻塞直到应用退出           |

package/README.md

@@ -71,7 +71,7 @@ const win = await pool.createWindow(true, false);
 
 ### Window Operations
 
-```typescript
+```javascript
 window.show();
 window.hide();
 window.maximize();
@@ -81,11 +81,9 @@ window.setTitle('New Title');
 window.openDevTools();
 ```
 
-### IPC Communication
+### Custom Messages
 
-The framework automatically injects a series of control functions after WebView page loading is complete. It is recommended to use these injected functions for IPC communication, rather than the native IPC wrapped by `@webviewjs/webview`.
-
-#### Send Custom Messages
+#### Send Messages
 
 Send messages via `window.postMessage` in the page:
 
@@ -112,7 +110,9 @@ pool.onCustomMessage = (window, data) => {
 - `window` — The window object that sent the message
 - `data` — Message content, an object type (automatically converted from JSON string via `JSON.parse`)
 
-#### Invoke Custom Events
+### Custom Events
+
+#### Invoke Events
 
 Invoke events via `window.invoke` in the page:
 
@@ -155,7 +155,44 @@ pool.unhandle('hello', (data) => {
 - `event` — Event name, must match the event name when listening
 - `callback` — Event handler function, must match the callback function when listening
 
-#### Window Control Functions
+### Global Variables
+
+#### Set Variables
+
+Set a global variable via `window.setGlobal` in the page:
+
+```javascript
+window.setGlobal('hello', 'world');
+```
+
+**Parameters**
+
+- `name` — Global variable name
+- `value` — Global variable value, any serializable data, will be serialized to JSON string before sending
+
+#### Get Variables
+
+Get a global variable via `window.getGlobal` in the page:
+
+```javascript
+const value = await window.getGlobal('hello');
+```
+
+**Parameters**
+
+- `name` — Global variable name
+
+#### Global Variable Map
+
+Get a `Map<string, any>` containing all global variables via `WindowPool.global` in the main process, which supports operations like set and get:
+
+```typescript
+const globals = pool.global;
+globals.set('hello', 'world');
+const value = globals.get('hello');
+```
+
+### Window Control Functions
 
 The following injected functions can be directly called in the page for window control:
 
@@ -246,8 +283,9 @@ if (window.isNexfepLoadDone) {
 | ------------------------------------- | -------------------------------------------------------------------------- | ---------------- | ------------------------------------------------------------------------ |
 | `constructor(userDataFolder?)`        | `userDataFolder`: string (optional)                                        | WindowPool       | Creates a window pool, optionally specifying the WebView2 user data directory |
 | `createWindow(isShow?, isDecorated?)` | `isShow`: boolean (default true), `isDecorated`: boolean (default true)    | Promise\<Window> | Creates and returns a window                                             |
-| `handle(event, callback)`            | `event`: string, `callback`: (data: string) => void                       | None             | Listens for the specified event, triggers callback when event is received   |
-| `unhandle(event, callback)`           | `event`: string, `callback`: (data: string) => void                       | None             | Removes the specified callback from the event listener                     |
+| `handle(event, callback)`             | `event`: string, `callback`: (data: string) => void                        | None             | Listens for the specified event, triggers callback when event is received |
+| `unhandle(event, callback)`           | `event`: string, `callback`: (data: string) => void                        | None             | Removes the specified callback from the event listener                     |
+| `global`                              | /                                                                          | Map\<string, any> | A global variable map of type: `Map<string, any>`                         |
 | `closeWindow(window)`                 | `window`: Window                                                           | Promise\<void>   | Closes the specified window and returns it to the pool                   |
 | `closePool()`                         | None                                                                       | Promise\<void>   | Closes the window pool and exits the application                         |
 | `mainloop()`                          | None                                                                       | void             | Starts the application main loop, blocking until the application exits   |
@@ -282,4 +320,4 @@ pnpm run compile
 
 ## License
 
-MIT License
+MIT License

package/index.d.ts

@@ -31,6 +31,7 @@ declare class WindowPool {
     private injectCount;
     private windowCount;
     private freeWindowCount;
+    global: Map<string, any>;
     constructor(WindowsWebview2UserDataFolder?: string);
     __injectCode(window: Window, code: string): Promise<void>;
     __injectControlFunctions(windowObj: Window): Promise<void>;

package/index.js

@@ -63,10 +63,8 @@ class Window {
         await this.myPool.__injectControlFunctions(this);
     }
     async loadHTML(html) {
-        console.log("Before loadHTML");
         await this.webview.loadHtml(html);
         await this.myPool.__injectControlFunctions(this);
-        console.log("After loadHTML");
     }
 }
 class WindowPool {
@@ -77,6 +75,7 @@ class WindowPool {
     injectCount;
     windowCount;
     freeWindowCount;
+    global;
     constructor(WindowsWebview2UserDataFolder = path.join(process.env.LOCALAPPDATA || os.homedir(), 'NexfepDevelopment.webview2-data')) {
         if (os.platform() === 'win32') {
             // 设置 WebView2 用户数据目录（仅 Windows 需要此配置）
@@ -85,7 +84,6 @@ class WindowPool {
                 fs.mkdirSync(userDataDir, { recursive: true });
             }
             process.env.WEBVIEW2_USER_DATA_FOLDER = userDataDir;
-            console.log('WebView2 user data folder:', userDataDir);
         }
         this.onCustomMessage = (window, data) => {
             console.log('Get Custom Message:', data, "from window", window.id);
@@ -96,12 +94,12 @@ class WindowPool {
         this.windows = [];
         this.windowCount = 0;
         this.freeWindowCount = 0;
+        this.global = new Map();
     }
     async __injectCode(window, code) {
         await window.webview.evaluateScript(code);
     }
     async __injectControlFunctions(windowObj) {
-        console.log("Create INJECT_CODE");
         const INJECT_CSS = `
         [nexfep-area-drag],
         [nexfep-area-drag] * {
@@ -204,6 +202,26 @@ class WindowPool {
             });
         }
         
+        window.setGlobal = (name, value) => {
+            const MessageBody = { type: 'NexfepSetGlobal', name: name, value: value }
+            window.ipc.postMessage(JSON.stringify(MessageBody));
+        }
+
+        window.getGlobal = (name) => {
+            const MessageBody = { type: 'NexfepGetGlobal', eventId: [${this.injectCount}, ++window.eventCount], name: name }
+            window.ipc.postMessage(JSON.stringify(MessageBody));
+            return new Promise((resolve, reject) => {
+                window.addEventListener("nexfep-get-global-result-"+${this.injectCount}+"-"+window.eventCount, (event) => {
+                    window.removeEventListener("nexfep-get-global-result-"+${this.injectCount}+"-"+window.eventCount, event);
+                    if(event.detail){
+                        resolve(event.detail);
+                    }else{
+                        resolve();
+                    }
+                });
+            });
+        }
+        
         // 注入 CSS 样式
         const style = document.createElement('style');
         style.textContent = \`${INJECT_CSS}\`;
@@ -215,9 +233,7 @@ class WindowPool {
         // 触发加载完成事件
         window.dispatchEvent(new Event('nexfep-load-done'));
         `;
-        console.log("Before inject code INJECT_CODE");
         await this.__injectCode(windowObj, INJECT_CODE);
-        console.log("After inject control functions");
     }
     async __createNewWindowObj() {
         const window = this.app.createBrowserWindow({ title: "Nexfep" });
@@ -284,6 +300,15 @@ class WindowPool {
                     }
                 });
             }
+            else if (dataObj.type == 'NexfepSetGlobal') {
+                this.global.set(dataObj.name, dataObj.value);
+            }
+            else if (dataObj.type == 'NexfepGetGlobal') {
+                const value = this.global.get(dataObj.name);
+                webview.evaluateScript(`
+                    window.dispatchEvent(new Event('nexfep-get-global-result-${dataObj.eventId[0]}-${dataObj.eventId[1]}', { detail: ${JSON.stringify(value)} }));
+                `);
+            }
         });
         return windowObj;
     }

package/package.json

@@ -14,7 +14,7 @@
     "webview",
     "typescript"
   ],
-  "version": "0.1.2",
+  "version": "0.1.3",
   "type": "module",
   "main": "./index.js",
   "scripts": {