Node.js 如何从Electron强制浏览器窗口中的外部链接在默认浏览器中打开？

我正在使用显示应用程序，我想强制在默认浏览器中打开外部链接。这是可能的，还是我必须以不同的方式处理这一问题？

我还没有测试过这一点，但我认为这应该是可行的：

1） 获取您的

浏览器窗口

 var wc = browserWindow.webContents;

2） 注册

WebContent

并拦截导航/链接点击：

wc.on（'will-navigate'，函数（e，url）{
/*如果url不是实际页面*/
如果（url！=wc.getURL（））{
e、 预防默认值（）；
开放浏览器（url）；
} 
}

3） 使用实现

openBrowser

。Linux桌面的一个示例：

var openBrowser（url）{
require（'child_process'）.exec（'xdg-open'+url）；
}

---

让我知道这是否适合你

我在检查了上一个答案的解决方案后得出了这个结论

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

根据，当单击外部链接时，

new窗口

被激发

---

注意：要求您在锚定标记上使用

target=“\u blank”

。

如果您没有在

锚定元素中使用
target=“\u blank”
，这可能适用于您：

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

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

对任何路过的人

我的用例：

我在我的应用程序中使用，它的预览模式是在同一窗口中打开链接。我希望所有链接都在默认操作系统浏览器中打开。我把这个基于其他答案的片段放在main.js文件中。它在创建新的BrowserWindow实例后调用它。我的实例称为mainWindow

let wc = mainWindow.webContents
wc.on('will-navigate', function (e, url) {
  if (url != wc.getURL()) {
    e.preventDefault()
    electron.shell.openExternal(url)
  }
})

检查请求的url是否为外部链接。如果是，则使用
shell.openExternal

mainWindow.webContents.on('will-navigate', function(e, reqUrl) {
  let getHost = url=>require('url').parse(url).host;
  let reqHost = getHost(reqUrl);
  let isExternal = reqHost && reqHost != getHost(wc.getURL());
  if(isExternal) {
    e.preventDefault();
    electron.shell.openExternal(reqUrl);
  }
}

将其放入
渲染器端js
文件中。它将在用户的默认浏览器中打开
http
，
https
链接

没有JQuery附加！无
target=“\u blank”
必需

let shell = require('electron').shell
document.addEventListener('click', function (event) {
  if (event.target.tagName === 'A' && event.target.href.startsWith('http')) {
    event.preventDefault()
    shell.openExternal(event.target.href)
  }
})

与公认的答案相比有所改进

链接必须是
target=“\u blank”

添加到
background.js
（或创建窗口的任何位置）：


注意：为了确保在所有应用程序窗口中都有这种行为，应在每次创建窗口后运行此代码。
对于Electron 5，这对我来说是有效的：


在
main.js
（创建浏览器窗口的地方）中，在主require语句中包含“shell”（通常位于文件顶部），例如：


在
createWindow（）
函数中，在
mainWindow=newbrowserWindow（{…}）
之后添加以下行：

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


我通过以下步骤解决了问题

在
const{app，BrowserWindow}=require（'electron'）上添加shell
设置nativeWindowOpen为true
添加以下侦听器代码
崔西平的参考
我倾向于在外部
.js
脚本中使用这些行：

let ele = document.createElement("a");
let url = "https://google.com";
ele.setAttribute("href", url);
ele.setAttribute("onclick", "require('electron').shell.openExternal('" + url + "')");

newwindow
现在被弃用，取而代之的是Electron 12中的
setWindowOpenHandler
（请参阅）

因此，最新的答案是：

mainWindow.webContents.setWindowOpenHandler(({ url }) => {
  shell.openExternal(url);
  return { action: 'deny' };
});

只有当
目标
设置为
\u blank
时，
新窗口才会启动吗？@YanFoto可能是我的错。。但我说的外部是指。。我尝试了
将导航
，但在我的情况下不起作用。不知道
shell
应该是什么，但我使用了npm节点模块打开了外部链接。因此，我的代码看起来完全相同，而不是第
require（'shell'）行即
var open=require（'open'）；打开（url）
而不是
require（'shell'）
，它为我抛出了一个错误，我能够使用
electron.shell.openExternal（url）使其正常工作
main
是使用
new BrowserWindow（）
@SkyzohKey创建浏览器窗口时返回的窗口。您通过伪代码编辑的条件表示“如果url是外部的”；你真的测试过这个
url！=wc.getURL（）是否有用？我想这永远都是真的。这假设JQuery是我想象的？
const {app, BrowserWindow, shell} = require('electron')


function createWindow () {
  // Create the browser window.
  const mainWindow = new BrowserWindow({
    width: 1350,
    height: 880,
    webPreferences: {
      nativeWindowOpen: true,
      preload: path.join(__dirname, 'preload.js')
    },
    icon: path.join(__dirname, './img/icon.icns')
})

  mainWindow.webContents.on('will-navigate', function(e, reqUrl) {
    let getHost = url=>require('url').parse(url).host;
    let reqHost = getHost(reqUrl);
    let isExternal = reqHost && reqHost !== getHost(wc.getURL());
    if(isExternal) {
      e.preventDefault();
      shell.openExternal(reqUrl, {});
    }
  })

let ele = document.createElement("a");
let url = "https://google.com";
ele.setAttribute("href", url);
ele.setAttribute("onclick", "require('electron').shell.openExternal('" + url + "')");

mainWindow.webContents.setWindowOpenHandler(({ url }) => {
  shell.openExternal(url);
  return { action: 'deny' };
});