使用 electron-builder 向 macOS info.plist 添加协议的正确方法是什么？

Question

我需要能够从浏览器启动我的 Electron 应用程序（就像登录 Slack 一样）。我知道我可以在 Electron 中使用 app.setAsDefaultProtocolClient(protocol[, path, args]) 将我的协议名称添加到我的 Electron 应用程序中。

然后在electron-builder 中，我可以使用带有extendInfo 属性的package.json 配置build.mac 来定义“Info.plist 的额外条目”。然而，这是文档给出的关于如何使用它的唯一说明。

使用 electron 和 electron-builder config build.mac.extendInfo 向 macOS info.plist 添加协议并能够按照描述使用它的正确方法是什么？

Answer 1

（代表问题作者发布解决方案，将其移至答案空间）。

它现在适用于以下内容 - 我已将其添加到我的 Electron package.json：

        "protocols": {
            "name": "my-app",
            "schemes": [
                "my-app"
            ]
        },
        "mac": {
            "target": "dmg",
            "extendInfo": "my-app"
        },

我在 electron.js 中有这个：

app.setAsDefaultProtocolClient('my-app');

这在我的 React 浏览器客户端应用程序代码中用于从浏览器启动应用程序：

document.location = 'my-app://open?url='

Answer 2

这个问题与如何使用自定义方案来接收 OAuth 响应有关，就像我的代码示例一样，您可以在本地运行，然后使用深度链接等：

• Code
• Blog Post

兴趣点：

• 插页式网页将控制权返回给浏览器应用程序 - 请参阅 this page
• 我的 package.json 公开了 Electron 部署方案

这应该给你一些比较的东西。这是关键代码：

插页式网页调用应用程序

window.addEventListener('DOMContentLoaded', function() {

    var redirectUri = 'x-mycompany-desktopapp:/callback';
    if (window.location.search) {
        redirectUri += window.location.search;
    }

    document.getElementById('continueButton').onclick = function() {
        window.location.href = redirectUri;
    };
}

注册方案

这会被 Electron 打包程序提取并包含在特定于平台的二进制文件中，从而导致特定于操作系统的注册：

"build": {
    "protocols": {
      "name": "finaldesktopapp",
      "schemes": [
        "x-mycompany-desktopapp"
      ]
    }
  },

接收通知

这使以下代码能够在应用程序的主端工作，如main.ts 文件中指定的那样：

app.setAsDefaultProtocolClient(this._configuration.oauth.privateSchemeName);

最后，您注册了一个回调，它可以解析 URL 并采取任何适当的操作 - 在我的例子中完成登录。

private _receiveNotificationInRunningInstance(privateSchemeUrl: string) {
}

机制有点棘手，并且在 macOS 和 Windows / Linux 上接收通知的方式不同。请参阅 this source file 及其 cmets 来解释详细信息。