You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Electron+WebRTC应用点击来电通知唤起最小化应用方案咨询

Electron来电通知点击唤起前台实现方案

核心思路

利用Electron的通知点击事件监听,结合主进程的BrowserWindow API实现窗口唤起:当用户点击来电通知时,触发窗口状态检查与唤起逻辑,将最小化的窗口恢复并聚焦到前台。

实现方案(两种可选)


方案1:渲染进程创建通知,通过IPC唤起窗口

适合通知逻辑在渲染进程处理的场景。

  1. 修改渲染进程的通知函数,添加点击事件监听并发送IPC请求:
function showNotification(body_content) {
  const myNotification = new Notification(NOTIFICATION_TITLE, {
    body: `Incoming Call from ${body_content}`
  });
  
  // 监听通知点击事件
  myNotification.onclick = () => {
    // 向主进程发送唤起窗口的指令
    window.electronAPI.invoke('restore-app-window');
  };
  
  myNotification.show();
  console.log(myNotification, 'notification');
}
  1. 主进程(main.js)中处理IPC请求:
const { app, BrowserWindow, ipcMain } = require('electron');
const path = require('path');

let mainWindow;

function createWindow() {
  mainWindow = new BrowserWindow({
    width: 800,
    height: 600,
    webPreferences: {
      contextIsolation: true, // 开启上下文隔离,安全最佳实践
      preload: path.join(__dirname, 'preload.js')
    }
  });

  mainWindow.loadFile('index.html');
}

app.whenReady().then(createWindow);

// 监听渲染进程的唤起请求
ipcMain.handle('restore-app-window', () => {
  if (!mainWindow) return;
  
  // 恢复最小化的窗口
  if (mainWindow.isMinimized()) {
    mainWindow.restore();
  }
  // 将窗口聚焦到前台
  mainWindow.focus();
});
  1. preload.js中暴露IPC接口(用于渲染进程与主进程安全通信):
const { contextBridge, ipcRenderer } = require('electron');

contextBridge.exposeInMainWorld('electronAPI', {
  invoke: (channel, data) => ipcRenderer.invoke(channel, data)
});

方案2:主进程直接创建通知(更简洁)

适合通知逻辑在主进程处理的场景,无需IPC通信:

// 主进程(main.js)中
const { app, BrowserWindow, Notification } = require('electron');
const NOTIFICATION_TITLE = '来电提醒';

let mainWindow;

function createWindow() {
  mainWindow = new BrowserWindow({
    width: 800,
    height: 600,
    // 窗口配置...
  });
  mainWindow.loadFile('index.html');
}

app.whenReady().then(createWindow);

// 主进程中定义通知函数
function showIncomingCallNotification(caller) {
  const notification = new Notification({
    title: NOTIFICATION_TITLE,
    body: `Incoming Call from ${caller}`
  });
  
  // 直接在主进程处理点击事件
  notification.on('click', () => {
    if (!mainWindow) return;
    
    if (mainWindow.isMinimized()) {
      mainWindow.restore();
    }
    mainWindow.focus();
  });
  
  notification.show();
}

// 可通过IPC从渲染进程触发该函数,比如:
ipcMain.handle('trigger-incoming-call', (_, caller) => {
  showIncomingCallNotification(caller);
});

注意事项

  • 确保主进程持有窗口实例的全局引用(如mainWindow),否则无法操作窗口。
  • 多窗口场景下,需调整逻辑定位到对应通话窗口(比如通过窗口ID、标签页标识)。
  • macOS系统需在「系统偏好设置-通知」中允许应用的通知权限,否则通知可能无法正常触发点击事件。
  • Windows系统需确保应用有前台唤起权限,部分安全软件可能限制此行为。

内容的提问来源于stack exchange,提问作者Shobhit Goyal

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.04 08:20:22