Electron開發實戰之記帳軟件19——經過協議喚起Electron應用

代碼倉庫： https://github.com/hilanmiao/LanMiaoDesktop

本文代碼參考自：https://www.jianshu.com/p/d880c0ca0911 做者有詳細說明，請認真閱讀。

只有在安裝並運行過一次以後，這個功能纔會生效！沒有安裝並運行過程序，協議固然不會被註冊。

背景

對於一個 URL 來講，其實就是指定了一個協議（protocol），而後讓系統用對應的應用去打開它。如 myapp://startapp/here?a=1&b=2，系統會去找到已經註冊了 myapp 這個協議的應用，而後把 URL 當作參數傳過去。

這樣咱們就能夠在瀏覽器中經過一個 <a> 標籤簡單地喚起應用了。

<a href="PocketBook:?a=1&b=2">打開</a>

嘗試打開

核心代碼：

/**
 * 協議處理
 */
function protocalHandler() {
    const args = [];
    if (!app.isPackaged) {
        // 若是是開發階段，須要把咱們的腳本的絕對路徑加入參數中
        args.push(path.resolve(process.argv[1]))
    }
    // 加一個 `--` 以確保後面的參數不被 Electron 處理
    args.push('--')

    // 註冊協議
    const PROTOCOL = pkg.name
    app.setAsDefaultProtocolClient(PROTOCOL, process.execPath, args)

    // 若是打開協議時，沒有其餘實例，則當前實例當作主實例，處理參數
    handleArgv(process.argv)

    // 其餘實例啓動時，主實例會經過 second-instance 事件接收其餘實例的啓動參數 `argv`
    app.on('second-instance', (event, argv) => {
        // Windows 下經過協議URL啓動時，URL會做爲參數，因此須要在這個事件裏處理
        if (process.platform === 'win32') {
            handleArgv(argv)
        }
    })

    // macOS 下經過協議URL啓動時，主實例會經過 open-url 事件接收這個 URL
    app.on('open-url', (event, urlStr) => {
        handleUrl(urlStr)
    })

    // 處理參數
    function handleArgv(argv) {
        const prefix = `${PROTOCOL}:`;
        // 開發階段，跳過前兩個參數（`electron.exe .`）
        // 打包後，跳過第一個參數（`myapp.exe`）
        const offset = app.isPackaged ? 1 : 2
        const url = argv.find((arg, i) => i >= offset && arg.startsWith(prefix))
        if (url) handleUrl(url)
    }

    // 解析Url
    function handleUrl(urlStr) {
        // myapp:?a=1&b=2
        const urlObj = new URL(urlStr);
        const {searchParams} = urlObj;
        console.log(urlObj.query); // -> a=1&b=2
        console.log(searchParams.get('a')); // -> 1
        console.log(searchParams.get('b')); // -> 2
        // 根據須要作其餘事情
    }

}