Electron Built-in AutoUpdater 踩坑記錄

oozliuoo發表於2019-04-11
UI

Electron Built-in AutoUpdater

因為之前做的 electron 應用開發使用的是 electron-packager 來對應用進行打包，根據官方文件的介紹，推薦使用內建的 AutoUpdater 來完成應用更新。

本文主要記錄一下在使用和配置 electron 內建 AutoUpdater 過程中踩過的坑、解決了的以及沒能解決的問題。雖然最後有一個問題沒有能解決，並因此決定遷移去使用 electron-builder 來進行打包以及使用該專案中的自動更新。

**注：以下篇幅的前提是，你已經能成功給 windows/Mac 平臺打包一個 electron app **

總覽

通過查閱 electron 官方文件關於更新這一部分的介紹，我們可以看到整個更新的流程是這樣的：

Electron Built-in AutoUpdater 踩坑記錄

而如果不是走 electron-builder 的話，其實需要我們做的是兩件事情：

  1. 配置一個伺服器來 serve 更新
  2. 在客戶端檢索、下載和應用相應的更新

下面的篇幅裡會按時間順序，在這兩個方面記錄和還原在使用和配置 electron 內建 AutoUpdater 過程中踩到的坑。之後會再開一篇文章記錄使用和配置 electron-builder 的過程以及兩者之間的對比。

配置 一個伺服器來 serve 更新

根據官方文件的介紹，electron 已經提供了幾個選擇：

  • Hazel - 使用 Github Releases 來管理和釋出更新
  • Nuts - 使用 Github Releases 來管理和釋出更新，並支援 private repository
  • electron-release-server - 自建伺服器來管理和釋出更新
  • Nucleus - maintained by Atlassian

由於我們的應用是走 Gitlab private 來做程式碼管理，並且暫無開源打算，所以我們會使用 electron-release-server 來管理應用的釋出和更新。

配置 electron-release-server

配置 electron-release-server 的目的就是提供一個管理和提供我們 electron app 版本的伺服器，以便我們的開發人員上傳、管理 app 版本，以及客戶端下載、更新版本。

配置的主要過程是根據 官方文件 進行的，下面將羅列我配置的步驟、遇到的坑以及解決的問題。我們也 fork 了這個專案並將相應更改應用到了這個 fork 中。

步驟

  1. 根據 部署文件 裡的要求，將專案中的 config/local.template 複製成 config/local.js 作為專案配置檔案
  2. 安裝和配置 PostgreSQL，linux 環境的話根據作業系統（CentOS 或者 Ubuntu）都可以找到比較好的教程，這裡我使用的是 Ditital Ocean 上的教程
  3. 根據 資料庫文件 裡的描述，將配置好的 PostgreSQL 引數按文件填入，需要注意的是要將配置檔案裡的 dirname 也填上。
  4. 保險起見，將 port 屬性也 comment out
  5. 上述步驟做完後，可以執行命令 npm start 來在本地執行

以上是專案中提供的步驟，但實際執行中會發現有很多問題在文件中沒有提到的：

docker.js 的問題 完成上述配置後，直接執行 npm start 會遇到這個錯誤：

Details:TypeError: Cannot read property 'split' of undefined
    at Object.<anonymous> (/Users/zhexuanliu/Desktop/mesh/electron-release-server/config/docker.js:28:67)
複製程式碼

這裡的問題是出在 config/docker.js 這個檔案裡。如果需要使用 Docker 的話，建議做的就是在 package.json 裡將 DATABASE_URL 環境變數加上。

由於我們這裡不打算使用 Docker，我們的處理方法就是將這個檔案移除即可。

解決上面這個問題後，我能成功將這個專案跑起來，並通過 localhost:1337 來訪問版本管理的介面，但接下來又遇到了一個問題：

上傳應用檔案一直失敗 具體來說就是，通過版本管理的介面上傳程式（可以參考 專案中的上傳文件），按上述步驟部署後，不管是執行在本地還是伺服器上，完成上傳之後都會提示上傳失敗。

查閱了專案 issues 及各個社群都沒有相關答案，我在 github 裡也提了 issue，但無人回答。所以最後我更改了一下他的程式碼，來解決這個問題。

更改的內容我也 comment 在了這個 issue 中。

客戶端檢測並應用更新

完成上述步驟後， electron-release-server 遍基本部署完畢了。訪問管理網頁並上傳 asset 後，asset 會自動立刻出於 serving 狀態。

接下來我們要做的是去調整和配置客戶端程式，以能夠檢測、應用更新。

CodeSign

由於客戶端程式進行更新檢測、應用都是需要走作業系統的更新流程的（Mac 的則是 AppStore），因此，對更新這個流程的測試只能在正式環境中進行，而且這個應用程式需要完成 Code Sign 這個步驟。具體內容可以參照文件

完成 Code Sign 的步驟在文件中的講解和介紹都比較清晰了，其本質就是兩步：

  1. 獲取 signing certificate
  2. 使用 signing certificate 對應用進行簽字認證

這裡稍微提一下的是，由於我們釋出的應用是要在 AppStore 外下載的，所以在蘋果這裡的簽名，我們需要的是

- Developer ID Application: Developer ID Application: * (*)
- Developer ID Installer: Developer ID Installer: * (*)
複製程式碼

獲取到 signing certificate 後，只需要安裝 electron-osx-sign 然後執行以下程式碼即可

electron-osx-sign <app>
複製程式碼

CodeSign - Windows

待續

Detect and Apply Updates

這一部分比較簡單，根據 electron 官方文件 裡的記錄操作即可。

相關文章