electron-call
v0.1.0
Published
The easiest main-renderer IPC communication
Downloads
31
Readme
electron-call
The easiest main-renderer IPC communication. Now calling a method/function in a renderer process looks the same as calling a local one. It supports both main → renderer and renderer → main calls.
Warning: API could be changed frequently until v0.2.0 release.
Key features
- Very simple API
- Typescript friendly
- Lightweight and fast
- No dependencies
- Supports context isolation mode
// MainApi.ts
import { app } from 'electron';
import call from 'electron-call';
export class MainApi {
async getAppName() {
return app.getName();
}
}
call.initialize();
call.provide('MainApi', new MainApi());
// renderer.ts
import call from 'electron-call';
import type { MainApi } from '../main/MainApi';
const mainApi = call.use<MainApi>('MainApi');
console.log(await mainApi.getAppName());
Installation
Install with npm:
npm install electron-call
Usage
Initialization
First of all, electron-call should be able to communicate between main and renderer processes:
call.initialize()
Under the hood call.initialize()
attempts to inject a preload script via
session.setPreloads()
. By default, it only does this for the defaultSession
.
Alternatively, you can import electron-call
in your preload script.
Providing API
There are 3 ways of defining API:
Using a class
Preferred way, since it provides the best type support
export class FsApi {
async selectDirectory(defaultPath: string) {
return dialog.showOpenDialog({
defaultPath,
properties: ['openDirectory'],
});
}
}
call.provide('FsApi', new FsApi());
Using an object
It works the same as above, but there's a lack of types. That's fine if you don't use TypeScript or prefer a separated interface for ApiName
call.provide('FsApi', {
async selectDirectory(defaultPath) {
return dialog.showOpenDialog({
defaultPath,
properties: ['openDirectory'],
});
},
});
Using a function
call.provideFunction('selectDirectory', async (defaultPath) => {
return dialog.showOpenDialog({
defaultPath,
properties: ['openDirectory'],
});
});
Consuming API
Using a class/object
You can omit using FsApi generic if you don't need type support
const fsApi = call.use<FsApi>('FsApi');
console.log(await fsApi.selectDirectory(defaultPath));
Also, you can get a remote class constructor instead of an instance
const FsApiProxy = call.use('FsApi') console.log(await new FsApiProxy().selectDirectory(defaultPath));
Using a function
const selectDirectory = call.useFunction('selectDirectory');
console.log(await selectDirectory(defaultPath));