Electron Svelte应用：如何让Webview加载页面的HTTPS请求显示在网络面板

• 确认Webview调试工具已正确启用
  确保webview标签开启devtools属性，同时在webPreferences中显式启用devTools：

  <webview id="targetWebview" src="https://your-page-url.com" devtools webpreferences="devTools=true"></webview>
  

  另外，主进程创建BrowserWindow时，必须开启主窗口的devTools，webview的调试依赖主窗口的调试环境。

• 调整Context Isolation相关配置
  开启contextIsolation可能会干扰调试工具对webview请求的捕获，可尝试临时关闭该选项排查问题：

  <webview src="..." webpreferences="contextIsolation=false, nodeIntegration=false, devTools=true"></webview>
  

  注意：关闭contextIsolation会降低应用安全性，调试完成后请根据业务场景调整。

• 用Electron Debugger API主动捕获请求
  在主进程中监听webview的挂载事件，主动附加调试器并开启网络监控：

  const { app, BrowserWindow } = require('electron');
  let mainWindow;
  
  app.whenReady().then(() => {
    mainWindow = new BrowserWindow({
      webPreferences: {
        devTools: true,
        webviewTag: true // 必须启用webview标签
      }
    });
  
    mainWindow.webContents.on('did-attach-webview', (_, webContents) => {
      webContents.debugger.attach('1.3');
      webContents.debugger.sendCommand('Network.enable');
      // 手动打印请求日志，同时触发DevTools网络面板捕获
      webContents.debugger.on('message', (_, method, params) => {
        if (method === 'Network.requestWillBeSent') {
          console.log('HTTPS 请求:', params.request.url);
        }
      });
    });
  
    mainWindow.loadFile('public/index.html'); // 加载你的Svelte应用入口
  });
  

• 禁用Site Isolation（针对新版本Electron）
  新版Electron默认开启的Site Isolation可能导致跨站点请求无法在DevTools中显示，可在主进程启动前添加命令行参数关闭：

  app.commandLine.appendSwitch('disable-site-isolation-trials');
  

• 重新验证证书与Web Security配置
  若目标站点使用自签名证书，需同时配置多个webPreferences参数：

  <webview src="..." webpreferences="webSecurity=false, ignoreCertificateErrors=true, allowRunningInsecureContent=true"></webview>
  

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