深度链接¶

概述¶

本指南将带你完成将 Electron 应用设置为特定协议默认处理程序的过程。

完成本教程后，我们将把应用设置为拦截并处理任何以特定协议开头的已点击 URL。在本指南中，我们将使用的协议是 "electron-fiddle://"。

示例¶

主进程（main.js）¶

首先，我们将从 electron 导入所需模块。这些模块有助于控制应用程序生命周期并创建原生浏览器窗口。

const { app, BrowserWindow, shell } = require('electron')

const path = require('node:path')

接下来，我们将注册应用程序以处理所有 "electron-fiddle://" 协议。

if (process.defaultApp) {
  if (process.argv.length >= 2) {
    app.setAsDefaultProtocolClient('electron-fiddle', process.execPath, [path.resolve(process.argv[1])])
  }
} else {
  app.setAsDefaultProtocolClient('electron-fiddle')
}

在 Windows 上，通过默认 Electron 可执行文件运行时（例如 electron .），注册必须包含应用入口路径，以便协议启动时加载正确的应用程序。打包后的应用会启动自己的可执行文件，不需要这些额外参数。

现在，我们将定义负责创建浏览器窗口的函数，并加载应用程序的 index.html 文件。

let mainWindow

const createWindow = () => {
  // Create the browser window.
  mainWindow = new BrowserWindow({
    width: 800,
    height: 600,
    webPreferences: {
      preload: path.join(__dirname, 'preload.js')
    }
  })

  mainWindow.loadFile('index.html')
}

在下一步中，我们将创建 BrowserWindow，并告诉应用程序如何处理点击外部协议的事件。

与 macOS 相比，Windows 和 Linux 上的代码会有所不同。这是因为这两个平台会发出 second-instance 事件，而不是 open-url 事件，并且 Windows 需要额外代码才能在同一 Electron 实例中打开协议链接的内容。有关此内容的更多信息，请参见这里。

Windows 和 Linux 代码：¶

```js @ts-type={mainWindow:Electron.BrowserWindow} @ts-type={createWindow:()=>void} const gotTheLock = app.requestSingleInstanceLock()

if (!gotTheLock) { app.quit() } else { app.on('second-instance', (event, commandLine, workingDirectory) => { // Someone tried to run a second instance, we should focus our window. if (mainWindow) { if (mainWindow.isMinimized()) mainWindow.restore() mainWindow.focus() } // the commandLine is array of strings in which last element is deep link url dialog.showErrorBox('Welcome Back', You arrived from: ${commandLine.pop()}) })

// Create mainWindow, load the rest of the app, etc... app.whenReady().then(() => { createWindow() // Check for deep link on cold start if (process.argv.length >= 2) { const lastArg = process.argv[process.argv.length - 1] if (lastArg.startsWith('electron-fiddle://')) { dialog.showErrorBox('Welcome Back', You arrived from: ${lastArg}) } } }) }

#### macOS 代码： {#macos-code}

> [!IMPORTANT]
> 在初始启动期间注册 `open-url` 监听器，在等待 `ready` 或其他异步初始化之前完成。稍后注册的监听器可能会错过由 macOS 传递的启动 URL。

```js @ts-type={createWindow:()=>void}
// This method will be called when Electron has finished
// initialization and is ready to create browser windows.
// Some APIs can only be used after this event occurs.
app.whenReady().then(() => {
  createWindow()
})

// Handle the protocol. In this case, we choose to show an Error Box.
app.on('open-url', (event, url) => {
  dialog.showErrorBox('Welcome Back', `You arrived from: ${url}`)
})

最后，我们将添加一些额外代码，以处理有人关闭应用程序的情况。

// Quit when all windows are closed, except on macOS. There, it's common
// for applications and their menu bar to stay active until the user quits
// explicitly with Cmd + Q.
app.on('window-all-closed', () => {
  if (process.platform !== 'darwin') app.quit()
})

重要说明¶

打包¶

在 macOS 和 Linux 上，此功能仅在应用打包后才会生效。如果你从命令行在开发环境中启动应用，它不会生效。打包应用时，你需要确保应用的 macOS Info.plist 和 Linux .desktop 文件已更新，以包含新的协议处理程序。一些用于捆绑和分发应用的 Electron 工具会替你处理此事。

Electron Forge ¶

如果你正在使用 Electron Forge，请在你的 Forge 配置中调整 packagerConfig 以支持 macOS，并调整相应 Linux makers 的配置以支持 Linux （请注意，以下示例仅显示添加配置更改所需的最少内容）：

{
  "config": {
    "forge": {
      "packagerConfig": {
        "protocols": [
          {
            "name": "Electron Fiddle",
            "schemes": ["electron-fiddle"]
          }
        ]
      },
      "makers": [
        {
          "name": "@electron-forge/maker-deb",
          "config": {
            "mimeType": ["x-scheme-handler/electron-fiddle"]
          }
        }
      ]
    }
  }
}

Electron Packager ¶

对于 macOS 支持：

如果你正在使用 Electron Packager 的 API，添加协议处理程序支持与 Electron Forge 的处理方式类似，只是 protocols 是传递给 packager 函数的 Packager 选项的一部分。

```js @ts-nocheck const packager = require('@electron/packager')

packager({ // ...other options... protocols: [ { name: 'Electron Fiddle', schemes: ['electron-fiddle'] } ]

}).then(paths => console.log(SUCCESS: Created ${paths.join(', ')})) .catch(err => console.error(ERROR: ${err.message}))

如果你正在使用 Electron Packager 的 CLI，请使用 `--protocol` 和 `--protocol-name` 标志。例如：

```shell
npx electron-packager . --protocol=electron-fiddle --protocol-name="Electron Fiddle"

结论¶

启动 Electron 应用后，你可以在浏览器中输入包含自定义协议的 URL，例如 "electron-fiddle://open"，然后观察应用会作出响应并显示一个错误对话框。

```fiddle docs/fiddles/system/protocol-handler/launch-app-from-URL-in-another-app

```

本页原文 Markdown：在 AtomGit 查看·内容源自开源项目 el/electron