https://github.com/zhujiaming/electron-renderer-to-renderer-bridge

electron-renderer-to-renderer-bridge can helps complete MessagePort access in 3 steps, making it easier to realize communication between independent html windows.
https://github.com/zhujiaming/electron-renderer-to-renderer-bridge

Last synced: 12 days ago
JSON representation

electron-renderer-to-renderer-bridge can helps complete MessagePort access in 3 steps, making it easier to realize communication between independent html windows.

• Host: GitHub
• URL: https://github.com/zhujiaming/electron-renderer-to-renderer-bridge
• Owner: zhujiaming
• Created: 2022-12-18T14:17:20.000Z (about 2 years ago)
• Default Branch: main
• Last Pushed: 2022-12-18T14:36:37.000Z (about 2 years ago)
• Last Synced: 2024-11-15T04:26:44.404Z (about 1 month ago)
• Language: JavaScript
• Size: 212 KB
• Stars: 2
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: readme.md

Awesome Lists containing this project

README

        
## electron-renderer-to-renderer-bridge

electron-renderer-to-renderer-bridge can helps complete MessagePort access in 3 steps, making it easier to realize communication between independent html windows.

### install

```powershell

npm install electron-renderer-to-renderer-bridge    

```

### Useage

```javascript

const { R2rBridgeRenderer, R2rBridgeMain } = require("electron-renderer-to-renderer-bridge");

```

- main process

```javascript

// main.js

R2rBridgeMain.init(clientWindow, serviceWindow); // BrowserWindow register

```

- client renderer page

```javascript

// preload_client.js

const port = await R2rBridgeRenderer.getClientPort(); // return a MessgePort

// then process MessagePort

// port.postMessage("hello service,wait reply");

// port.onmessage = (ev) => {

//   console.log("[service reply]:", ev.data);

// };

```

```javascript

// preload_service.js

const port = await R2rBridgeRenderer.getServicePort(); // return a MessgePort

// then process MessagePort

// port.onmessage = (ev) => {

//   console.log("[from client message]:", ev.data);

//   port.postMessage("this message is from service!");

// };

// port.start();

```

### Snapshot

![1](./snapshot/1.png)

### Link

[message-ports](https://www.electronjs.org/zh/docs/latest/tutorial/message-ports)\

[Ipc](https://www.electronjs.org/zh/docs/latest/tutorial/ipc)