Electron JS如何阻止应用内导航到特定路径名？

要在Electron应用内阻止用户导航到指定页面，可以通过监听webContents的导航事件，在事件触发时判断目标路径并拦截，以下是具体实现：

核心思路 #

利用Electron主进程中BrowserWindow的webContents对象提供的导航事件，在导航发生前或发生时判断目标URL的路径，若匹配到需要阻止的页面，则取消导航行为。

实现代码（主进程） #

拦截常规页面导航 #

适用于非单页应用（常规多页面跳转）：

const { app, BrowserWindow } = require('electron');
const url = require('url');

let mainWindow;

function createWindow() {
  mainWindow = new BrowserWindow({
    width: 800,
    height: 600,
    webPreferences: {
      nodeIntegration: false,
      contextIsolation: true
    }
  });

  // 加载初始页面
  mainWindow.loadURL('https://WebsiteApp.com');

  // 监听即将发生的导航
  mainWindow.webContents.on('will-navigate', (event, targetUrl) => {
    const parsedUrl = url.parse(targetUrl);
    // 定义需要拦截的路径列表
    const blockedPaths = ['/security', '/your-second-blocked-path'];
    
    if (blockedPaths.includes(parsedUrl.pathname)) {
      event.preventDefault(); // 阻止导航
      // 可选：给用户提示
      mainWindow.webContents.executeJavaScript(`alert('该页面无法访问')`);
      console.log(`已拦截导航到：${targetUrl}`);
    }
  });

  mainWindow.on('closed', () => {
    mainWindow = null;
  });
}

app.whenReady().then(createWindow);

app.on('window-all-closed', () => {
  if (process.platform !== 'darwin') app.quit();
});

app.on('activate', () => {
  if (BrowserWindow.getAllWindows().length === 0) createWindow();
});

拦截单页应用（SPA）内部导航 #

如果目标网站是SPA（路由在页面内跳转，不触发窗口级导航），需要额外监听did-navigate-in-page事件：

// 在createWindow函数内添加以下代码
mainWindow.webContents.on('did-navigate-in-page', (event, currentUrl) => {
  const parsedUrl = url.parse(currentUrl);
  const blockedPaths = ['/security', '/your-second-blocked-path'];
  
  if (blockedPaths.includes(parsedUrl.pathname)) {
    // 回退到上一页或重置页面
    mainWindow.webContents.goBack();
    // 或者直接加载初始页面：mainWindow.webContents.loadURL('https://WebsiteApp.com');
    mainWindow.webContents.executeJavaScript(`alert('该页面无法访问')`);
    console.log(`已拦截SPA内部导航到：${currentUrl}`);
  }
});

关键说明 #

• will-navigate：在窗口即将导航到新URL时触发，调用event.preventDefault()可直接阻止导航。
• did-navigate-in-page：在页面内修改URL（SPA路由跳转）时触发，此时导航已完成，需通过回退或重置页面来拦截。
• 可通过blockedPaths数组扩展需要拦截的页面路径，支持多个目标页面。

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