Electron App - 如何在浏览器中打开链接？

Question

我正在尝试使用 Electron 应用程序在新的浏览器窗口中打开链接。

const test = () => {
  const shell = window.require('electron').shell;
  shell.openExternal("https://google.com");
}

当我这样做时，我收到错误

"window.require is not a function"

我当然对此进行了研究，并发现了几个“修复”，但没有一个对我有用。我已将我的

webpack.config.js

编辑为：

module.exports = {
    configureWebpack: {
      externals: {
        './cptable': 'var cptable'
      },
      resolve: {
        fallback: {
          'fs': false,
          'crypto': false,
          'path': false,
        }
      }
    },
  }

我还确保

nodeIntegration

像这样启用：

const mainWindow = new BrowserWindow({
        width: 1280,
        height: 720,
        webPreferences: {
          nodeIntegration: true
        },
        autoHideMenuBar: true,
        resizable: false,
        webPreferences: {
            preload: path.join(__dirname, 'preload.js')
        }
    })
    ```

still no success. any idea?

Answer 1

renderer.js - 从您的渲染器发送请求。

const response = await window.electronAPI.openLinkPlease() 

preload.js - 你有这个中间件，你的请求将在其中发送到电子。

process.once("loaded", () => {
  contextBridge.exposeInMainWorld('electronAPI', {
      openLinkPlease: () => ipcRenderer.invoke('openLinkPlease'),
  })
});

electron.js - 在这里您将收到打开请求，电子将在您的默认浏览器中打开此网址。 首先在最开始添加

const {shell} = require("electron"); 

以添加shell功能，然后添加

            preload: path.join(__dirname, 'preload.js'),
    },
});

添加

ipcMain.handle('openLinkPlease', () => {
    shell.openExternal("https://google.com");
})

这是我的应用程序的工作原理屏幕

Answer 2

您可以简单地在

setWindowOpenHandler()

中使用

mainWindow

。

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

这将强制 URL 在默认浏览器中打开。