Electron অ্যাপ্লিকেশনগুলোতে Main Process এবং Renderer Process এর মধ্যে ডেটা আদান-প্রদান করার জন্য IPC (Inter-Process Communication) ব্যবহৃত হয়। এই উদ্দেশ্যে ipcMain এবং ipcRenderer মডিউল ব্যবহার করা হয়।
ipcMain (Main Process এ ব্যবহৃত)
ipcMain হলো Main Process এর জন্য ব্যবহৃত মডিউল, যা Renderer Process থেকে আসা মেসেজ গ্রহণ করে এবং সাড়া পাঠায়।
ipcRenderer (Renderer Process এ ব্যবহৃত)
ipcRenderer হলো Renderer Process এর জন্য ব্যবহৃত মডিউল, যা Main Process এ মেসেজ পাঠায় এবং সেখান থেকে সাড়া গ্রহণ করে।
১. ipcMain এবং ipcRenderer এর মাধ্যমে ডেটা আদান-প্রদান
ধাপ ১: Main Process (main.js)
Main Process মেসেজ গ্রহণ করতে ipcMain ব্যবহার করে এবং সাড়া পাঠাতে event.reply() ব্যবহার করা হয়।
const { app, BrowserWindow, ipcMain } = require('electron');
let mainWindow;
app.on('ready', () => {
mainWindow = new BrowserWindow({
width: 800,
height: 600,
webPreferences: {
nodeIntegration: true
},
});
mainWindow.loadFile('index.html');
// Renderer থেকে মেসেজ গ্রহণ
ipcMain.on('message-from-renderer', (event, arg) => {
console.log('Renderer থেকে বার্তা:', arg);
// Main Process থেকে Renderer Process-এ সাড়া পাঠানো
event.reply('reply-from-main', 'Main Process থেকে উত্তর!');
});
});
ipcMain.on() ব্যবহার করে Renderer Process থেকে আসা মেসেজ গ্রহণ করা হয় এবং event.reply() এর মাধ্যমে সাড়া পাঠানো হয়।
ধাপ ২: Renderer Process (index.html)
Renderer Process এ ipcRenderer ব্যবহার করে Main Process-এ মেসেজ পাঠানো হয় এবং তার উত্তর গ্রহণ করা হয়।
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Renderer Process</title>
</head>
<body>
<h1>Renderer Process থেকে Main Process এর সাথে যোগাযোগ</h1>
<button id="sendMessageBtn">Main Process এ বার্তা পাঠাও</button>
<script>
const { ipcRenderer } = require('electron');
document.getElementById('sendMessageBtn').addEventListener('click', () => {
// Main Process-এ বার্তা পাঠানো
ipcRenderer.send('message-from-renderer', 'Hello from Renderer!');
});
// Main Process থেকে উত্তর গ্রহণ
ipcRenderer.on('reply-from-main', (event, arg) => {
console.log('Main Process থেকে উত্তর:', arg);
});
</script>
</body>
</html>
ipcRenderer.send() ব্যবহার করে Main Process-এ মেসেজ পাঠানো হয় এবং ipcRenderer.on() এর মাধ্যমে Main Process থেকে উত্তর গ্রহণ করা হয়।
২. ডেটা আদান-প্রদান উদাহরণ
ধরা যাক, Renderer Process থেকে Main Process-এ ডেটা পাঠানো হচ্ছে এবং Main Process সেই ডেটার উপর ভিত্তি করে একটি কাজ করছে। এর পরে, Main Process সেই ডেটা নিয়ে একটি উত্তর পাঠাচ্ছে।
Main Process (main.js)
const { app, BrowserWindow, ipcMain } = require('electron');
let mainWindow;
app.on('ready', () => {
mainWindow = new BrowserWindow({
width: 800,
height: 600,
webPreferences: {
nodeIntegration: true
},
});
mainWindow.loadFile('index.html');
// Renderer থেকে ডেটা গ্রহণ করা
ipcMain.on('request-data', (event) => {
// Main Process থেকে Renderer Process-এ ডেটা পাঠানো
event.reply('response-data', { message: 'এই ডেটা Main Process থেকে এসেছে!' });
});
});
Renderer Process (index.html)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Renderer Process</title>
</head>
<body>
<h1>Renderer Process থেকে Main Process এর সাথে যোগাযোগ</h1>
<button id="requestDataBtn">Main Process থেকে ডেটা চাই</button>
<p id="response"></p>
<script>
const { ipcRenderer } = require('electron');
document.getElementById('requestDataBtn').addEventListener('click', () => {
// Main Process থেকে ডেটা চাওয়া
ipcRenderer.send('request-data');
});
// Main Process থেকে আসা ডেটা গ্রহণ
ipcRenderer.on('response-data', (event, data) => {
document.getElementById('response').textContent = data.message;
});
</script>
</body>
</html>
৩. বিভিন্ন ডেটা টাইপ পাঠানো
ipcMain এবং ipcRenderer এর মাধ্যমে আপনি বিভিন্ন ধরনের ডেটা পাঠাতে পারেন, যেমন স্ট্রিং, অবজেক্ট, অ্যারে ইত্যাদি।
উদাহরণ: একটি অবজেক্ট পাঠানো
// Renderer থেকে Object পাঠানো
ipcRenderer.send('message-from-renderer', { name: 'John', age: 30 });
এবং Main Process এ সেই অবজেক্ট গ্রহণ করা:
ipcMain.on('message-from-renderer', (event, arg) => {
console.log(arg.name); // John
console.log(arg.age); // 30
});
সারাংশ
ipcMain(Main Process): Renderer Process থেকে মেসেজ গ্রহণ করে এবং সাড়া পাঠায়।ipcRenderer(Renderer Process): Main Process এ মেসেজ পাঠায় এবং সাড়া গ্রহণ করে।- ডেটা আদান-প্রদান করার জন্য
ipcMainএবংipcRendererব্যবহৃত হয়। - ডেটা যেমন স্ট্রিং, অবজেক্ট, অ্যারে ইত্যাদি পাঠানো সম্ভব।
এভাবে Main Process এবং Renderer Process এর মধ্যে ডেটা আদান-প্রদান করে, অ্যাপ্লিকেশনটি আরো কার্যকরী এবং ইন্টারঅ্যাকটিভ হয়ে ওঠে।
Read more
