Electron.js：Windows与Linux平台获取活动窗口浏览器URL问题

核心思路 #

由于active-win仅支持Mac平台，Windows和Linux需要分别借助系统命令+浏览器远程调试接口实现，核心分为两步：

1. 获取当前活动窗口的浏览器进程名与窗口标题
2. 通过浏览器的远程调试接口匹配对应窗口的URL

Windows平台实现步骤 #

1. 获取活动窗口信息

通过PowerShell命令获取前台窗口的进程名和标题，结合Electron内置的child_process执行：

const { exec } = require('child_process');

async function getWinActiveWindowInfo() {
  const psCmd = `$fgProc = Get-WmiObject Win32_Process -Filter "ProcessId=(Get-Process -Id (Get-WmiObject Win32_Process -Filter 'Handle=(Get-ForegroundWindow)').ParentProcessId)"; $fgProc.Name.Split('.')[0] + "|" + $fgProc.Description`;
  return new Promise((resolve) => {
    exec(`powershell -Command "${psCmd}"`, (err, stdout) => {
      if (err) resolve(null);
      const [procName, windowTitle] = stdout.trim().split('|');
      resolve({ procName, windowTitle });
    });
  });
}

2. 对接浏览器远程调试

Chrome/Edge/Firefox均支持远程调试端口，需让用户在浏览器启动参数中添加对应端口：

• Chrome/Edge：添加--remote-debugging-port=9222
• Firefox：添加--remote-debugging-port=6000

通过chrome-remote-interface包（或直接请求调试接口）获取URL：

const cri = require('chrome-remote-interface');

async function getChromeUrl(windowTitle) {
  try {
    const client = await cri({ port: 9222 });
    const { Target } = client;
    const targets = await Target.getTargets();
    const target = targets.find(t => t.title === windowTitle && t.type === 'page');
    await client.close();
    return target?.url || null;
  } catch (e) {
    return '请确保Chrome/Edge已开启远程调试端口（--remote-debugging-port=9222）';
  }
}

async function getFirefoxUrl(windowTitle) {
  try {
    const res = await fetch('http://localhost:6000/json');
    const targets = await res.json();
    return targets.find(t => t.title === windowTitle)?.url || null;
  } catch (e) {
    return '请确保Firefox已开启远程调试端口（--remote-debugging-port=6000）';
  }
}

Linux平台实现步骤 #

1. 获取活动窗口信息

需要先安装xdotool（Debian/Ubuntu：sudo apt install xdotool），然后执行命令获取窗口类名和标题：

async function getLinuxActiveWindowInfo() {
  const getWindowName = () => new Promise((res) => exec('xdotool getactivewindow getwindowname', (err, out) => res(err ? null : out.trim())));
  const getClassName = () => new Promise((res) => exec('xdotool getactivewindow getwindowclassname', (err, out) => res(err ? null : out.trim())));
  
  const [windowTitle, className] = await Promise.all([getWindowName(), getClassName()]);
  if (!windowTitle || !className) return null;
  return { procName: className.split('.')[0].toLowerCase(), windowTitle };
}

2. 对接浏览器远程调试

与Windows逻辑一致，利用Chrome/Edge的9222端口、Firefox的6000端口获取URL，代码可复用Windows平台的getChromeUrl和getFirefoxUrl函数。

整合Electron工具函数 #

将各平台逻辑整合为统一调用的函数：

async function getActiveBrowserUrl() {
  let windowInfo;
  const platform = process.platform;

  if (platform === 'win32') {
    windowInfo = await getWinActiveWindowInfo();
  } else if (platform === 'linux') {
    windowInfo = await getLinuxActiveWindowInfo();
  } else {
    // Mac平台使用active-win
    const activeWin = require('active-win');
    const win = await activeWin();
    windowInfo = { procName: win.owner.name.toLowerCase(), windowTitle: win.title };
  }

  if (!windowInfo) return '无法获取活动窗口信息';

  switch (windowInfo.procName) {
    case 'chrome':
    case 'msedge':
      return await getChromeUrl(windowInfo.windowTitle);
    case 'firefox':
      return await getFirefoxUrl(windowInfo.windowTitle);
    default:
      return '当前活动窗口不是支持的浏览器';
  }
}

注意事项 #

• 浏览器必须手动添加远程调试端口参数，否则无法获取URL
• Linux下需确保已安装xdotool，Electron打包后可提示用户安装
• Windows下PowerShell执行权限不足时，可能需要以管理员身份运行应用
• 部分浏览器的窗口标题可能存在截断，需根据实际情况调整匹配逻辑

内容的提问来源于stack exchange，提问作者Shivani Are