在浏览器中打开Electron链接

Question

是否有任何(简单/内置方式)打开一个新的浏览器(我的意思是默认的OS浏览器)窗口,从Electron链接而不是访问您的Electron应用程序内的链接？

Answer 1

你可以简单地使用:

require("shell").openExternal("http://www.google.com")

Answer 2

有一种比@Marcelo提出的更好更简单的方法,但更容易实现所有链接同时实现@zianwar所提出的.

const shell = require('electron').shell;

// assuming $ is jQuery
$(document).on('click', 'a[href^="http"]', function(event) {
    event.preventDefault();
    shell.openExternal(this.href);
});

注意:需要jQuery.

Answer 3

我的代码片段根据 Electron 版本 ^12.0.0 中的折旧提供线索，将此代码放在您的“入口点” main.js（或您所说的任何名称）中：

const win = new BrowserWindow();
win.webContents.setWindowOpenHandler(({ url }) => {
    // config.fileProtocol is my custom file protocol
    if (url.startsWith(config.fileProtocol)) {
        return { action: 'allow' };
    }
    // open url in a browser and prevent default
    shell.openExternal(url);
    return { action: 'deny' };
});

链接也必须有target="_blank"。

Answer 4

mainWindow.webContents.on('new-window', function(e, url) {
  e.preventDefault();
  require('electron').shell.openExternal(url);
});

要求您在锚标记上使用 target="_blank"。

Answer 5

可以在这个要点中找到一些方便的解决方案。

通过侦听主体，以下解决方案将适用于 JavaScript 运行时可能尚不存在但仅稍后出现在 DOM 中的<a>标签。

luizcarraro的这个需要 jQuery：

$('body').on('click', 'a', (event) => {
  event.preventDefault();
  require("electron").shell.openExternal(event.target.href);
});

您可以更改选择器以仅定位某些链接，例如'#messages-view a'或'a.open-external'。

这是一个没有任何库的替代方案（源自zrbecker的）：

document.body.addEventListener('click', event => {
  if (event.target.tagName.toLowerCase() === 'a') {
    event.preventDefault();
    require("electron").shell.openExternal(event.target.href);
  }
});

请参阅要点以获取更多示例。