electron阻止應用關閉

下載Quick start項目

這裏爲了便於演示，咱們直接從GitHub上下載Quick start項目

git clone https://github.com/electron/electron-quick-start
cd electron-quick-start
npm install

安裝成功後，執行npm start運行項目。就能夠看到hello world界面了。

阻止關閉方法一

這裏直接監聽onbeforeunload事件，每當頁面刷新或關閉時，都會觸發這個事件。在index.html中咱們添加下面一段代碼

//index.html
    window.onbeforeunload = (e) => {
      console.log('I do not want to be closed')
      e.returnValue = false
    }

這樣，咱們不管點擊關閉，仍是使用alt+f4都沒法將頁面關閉。效果如圖。

chrome在若是沒有任何鍵盤輸入操做的狀況下，執行該監聽方法時會在console界面裏拋出一個error，沒必要在乎。

這麼作雖然可以實現咱們的需求，但同時存在一些問題：

• 應用真的沒法關閉，除非終止進程
• 頁面既沒法關閉，也沒法刷新

方法二

咱們在main.js中監聽close事件。定義一個flag標識是否能夠關閉。若是不能夠關閉，則阻止該事件。

//main.js
  let canQuit = false;
  mainWindow.on('close', (event) => {
    if (!canQuit) {
      event.preventDefault();}
  });

我我的更推薦使用第二種方法，由於該方法能夠自由的決定頁面是否真的須要關閉，並且不會妨礙頁面刷新。

那麼如何關閉呢？

這裏咱們註冊一個全局的快捷鍵，這個快捷鍵能夠修改canQuit這個變量的值，從而可讓程序順利退出。具體實現可參考下面代碼。

const {app, BrowserWindow,globalShortcut,dialog} = require('electron') //這裏須要引入globalShortcut和dialog
app.on('ready', () => {
  globalShortcut.register('CommandOrControl+Alt+K', () => {
    dialog.showMessageBox({
      type: 'info',
      title: 'Information',
      message: 'Do you really want to close the application?',
      buttons: ['Yes','No']
    },(index)=>{
      console.log('you chose',index)
      if(index===0){
        canQuit=true;
        app.quit();
      }
    })
  })
})

效果以下