Search code examples
reactjselectrondeep-linking

Electron+React deep link


I work on Electron + React application(with react-router of course), and should implement deep linking there. I almost handled this task, but I can't get parameters from a deep link in React. I already read this article Open app and pass parameters with deep linking using Electron (macOS), and I getting params in electron file. But I don't know how can get this link data in react code. I would appreciate it if someone could help with this. Thank you


Solution

  • To send data from the main process to a renderer process (the window that is rendering your React code), you need to use contents.send(channel, ...args).

    For your case, the communication would look something like this for macOS

    // Protocol handler for macOS
    app.on('open-url', (event, url) => {
      event.preventDefault()
    
      // send url data to React process
      reactBrowserWindow.webContents.send('testChannel', url)
    })
    

    and inside the React code (Node integration needs to be enabled or this code should be in a preload script)

    const { ipcRenderer } = require("electron")
    
    ipcRenderer.on('testChannel', (event, url) => {
      console.log(url)
    })