electron globalShortcut 快捷键,在焦点移到其他软件上时,调用快捷键报错

electron 开发软件,在设置了 globalShortcut 快捷键后,在当前开发的软件上调用快捷键正常,但是当焦点不在当前软件时,在使用快捷键,好些时候会报错。大概率与系统快捷键产生冲突或者快键键控制的回调里获取的内容,需在软件聚焦时才可获取到。

开始我设置快键键的方式:

javascript 复制代码
function createWindow () {
  // 隐藏窗体顶部菜单
  Menu.setApplicationMenu(null)

  /**
   * Initial window options
   */
  mainWindow = new BrowserWindow({
    width: 1338, // 宽
    height: 839, // 高
    minWidth: 1024,
    minHeight: 600,
    useContentSize: true,
    show: false, // 创建后是否显示
    frame: false, // 添加后自定义标题//自定义边框
    center: true, // 是否出现在屏幕居中的位置
    fullscreenable: platform === 'darwin',
    resizable: false, // 可否缩放
    movable: true, // 可否移动
    maximizable: false,
    minimizable: false,
    title: '当前项目名称', // 默认窗口标题
    transparent: false, // 是否是透明窗口(仅macOS)
    // vibrancy: 'ultra-dark', // 窗口模糊的样式(仅macOS)
    backgroundColor: 'none', // 背景色,用于transparent和frameless窗口
    hasShadow: true, // Boolean (可选) - 窗口是否有阴影. 仅在 macOS 上支持. 默认值为 true
    titleBarStyle: 'hidden',
    webPreferences: {
      nodeIntegration: true,
      webSecurity: false, // electron窗体跨域方案
      backgroundThrottling: false // 当页面被置于非激活窗口的时候是否停止动画和计时器
    }
  })

  mainWindow.setMenu(null) // 隐藏菜单栏
  if (platform === 'darwin') {
    Menu.setApplicationMenu(Menu.buildFromTemplate([]))
  }

  mainWindow.loadURL(winURL)

  mainWindow.on('ready-to-show', function () {
    mainWindow.show() // 初始化后再显示
  })

  mainWindow.on('closed', () => {
    mainWindow = null
  })
}

app.on('window-all-closed', () => {
  if (process.platform !== 'darwin') {
    app.quit()
  }
})

app.on('ready', createWindow)

app.on('activate', () => {
  if (mainWindow === null) {
    createWindow()
  }
})

app.whenReady().then(() => {
  // 设置快捷键
  globalShortcut.register('CommandOrControl+Alt+T', () => {
    const currentWindow = BrowserWindow.getFocusedWindow()
    currentWindow.webContents.openDevTools()
  })
})

app.on('will-quit', () => {
  // 注销所有快捷键
  globalShortcut.unregisterAll()
})

但是这样在失去焦点时,windows和mac下都会报错:

原因是:const currentWindow = BrowserWindow.getFocusedWindow() 方法需在当前软件聚焦时才可正常调用。

const currentWindow = BrowserWindow.getFocusedWindow() 改为 mainWindow.webContents.openDevTools()

javascript 复制代码
// 将 const currentWindow = BrowserWindow.getFocusedWindow() 改为以下代码
mainWindow.webContents.openDevTools()

这种改法在windows下正常,但是mac下关闭程序,程序在Dock中还在,这是使用这种方式依然会报错,这是因为我们没有再mac环境下在程序关闭的时候注销快捷键。所以我们需要再window-all-closed补充上mac环境下的处理。

javascript 复制代码
function createWindow () {
  // 隐藏窗体顶部菜单
  Menu.setApplicationMenu(null)

  /**
   * Initial window options
   */
  mainWindow = new BrowserWindow({
    width: 1338, // 宽
    height: 839, // 高
    minWidth: 1024,
    minHeight: 600,
    useContentSize: true,
    show: false, // 创建后是否显示
    frame: false, // 添加后自定义标题//自定义边框
    center: true, // 是否出现在屏幕居中的位置
    fullscreenable: platform === 'darwin',
    resizable: false, // 可否缩放
    movable: true, // 可否移动
    maximizable: false,
    minimizable: false,
    title: '当前项目名称', // 默认窗口标题
    transparent: false, // 是否是透明窗口(仅macOS)
    // vibrancy: 'ultra-dark', // 窗口模糊的样式(仅macOS)
    backgroundColor: 'none', // 背景色,用于transparent和frameless窗口
    hasShadow: true, // Boolean (可选) - 窗口是否有阴影. 仅在 macOS 上支持. 默认值为 true
    titleBarStyle: 'hidden',
    webPreferences: {
      nodeIntegration: true,
      webSecurity: false, // electron窗体跨域方案
      backgroundThrottling: false // 当页面被置于非激活窗口的时候是否停止动画和计时器
    }
  })

  mainWindow.setMenu(null) // 隐藏菜单栏
  if (platform === 'darwin') {
    Menu.setApplicationMenu(Menu.buildFromTemplate([]))
  }

  mainWindow.loadURL(winURL)

  mainWindow.on('ready-to-show', function () {
    mainWindow.show() // 初始化后再显示

    // 注册快捷键
    globalShortcut.register('CommandOrControl+Alt+T', () => {
      mainWindow.webContents.openDevTools()
    })
  })

  mainWindow.on('closed', () => {
    mainWindow = null
  })
}

app.on('window-all-closed', () => {
  if (process.platform !== 'darwin') {
    // windows下调用退出方法
    app.quit()
  } else {
    // mac环境注销所有快捷键
    globalShortcut.unregisterAll()
  }
})

app.on('ready', createWindow)

app.on('activate', () => {
  if (mainWindow === null) {
    createWindow()
  }
})

// 退出程序
app.on('will-quit', () => {
  // windows注销所有快捷键
  globalShortcut.unregisterAll()
})

正确逻辑的核心代码:

javascript 复制代码
  mainWindow.on('ready-to-show', function () {
    mainWindow.show() // 初始化后再显示

    // 注册快捷键
    globalShortcut.register('CommandOrControl+Alt+T', () => {
      mainWindow.webContents.openDevTools()
    })
  })

app.on('window-all-closed', () => {
  if (process.platform !== 'darwin') {
    // windows下调用退出方法
    app.quit()
  } else {
    // mac环境注销所有快捷键
    globalShortcut.unregisterAll()
  }
})

// 退出程序
app.on('will-quit', () => {
  // windows环境注销所有快捷键
  globalShortcut.unregisterAll()
})
相关推荐
杰~JIE几秒前
前端工程化概述(初版)
前端·自动化·工程化·前端工程化·sop
程序员_三木1 分钟前
使用 Three.js 创建圣诞树场景
开发语言·前端·javascript·ecmascript·three
赵大仁30 分钟前
深入理解 Vue 3 中的具名插槽
前端·javascript·vue.js·react.js·前端框架·ecmascript·html5
一雨方知深秋35 分钟前
v-bind 操作 class(对象,数组),v-bind 操作 style
前端·css·vue.js·html·style·class·v-bind
安晴晚风2 小时前
从0开始在linux服务器上部署SpringBoot和Vue
linux·运维·前端·数据库·后端·运维开发
前端小小王3 小时前
pnpm、Yarn 和 npm 的区别?
前端·npm·node.js
supermapsupport3 小时前
使用npm包的工程如何引入mapboxgl-enhance/maplibre-gl-enhance扩展包
前端·webpack·npm·supermap·mapboxgl
牛奔3 小时前
windows nvm 切换node版本后,npm找不到
前端·windows·npm·node.js
鱼大大博客3 小时前
Edge SCDN酷盾安全重塑高效安全内容分发新生态
前端·安全·edge
鸭梨山大。3 小时前
NPM组件包 vant部分版本内嵌挖矿代码
前端·安全·npm·node.js·vue