Electron无法打开指定URL：新手配置后运行npm start异常求助

针对你遇到的窗口无法加载目标页面的问题，给你几个排查和解决方向：

1. 修改User-Agent绕过网站检测 #

很多网站（包括Google）会识别Electron默认的User-Agent并阻止访问，你可以自定义UA模拟普通浏览器：

const { app, BrowserWindow } = require('electron')
const createWindow = () => {
    const win = new BrowserWindow({
        width: 800,
        height: 600,
        webPreferences: {
            // 加载外部页面时建议保持contextIsolation开启，提升安全性
            contextIsolation: true
        }
    })
    // 模拟Chrome浏览器的User-Agent
    win.webContents.setUserAgent('Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/118.0.0.0 Safari/537.36')
    win.loadURL('https://www.google.com/')
}
app.whenReady().then(() => {
    createWindow()
})

2. 检查网络与代理设置 #

• 确认你的网络可以正常访问目标URL，先用普通浏览器打开测试
• 如果使用代理，需在Electron中配置对应代理，或关闭代理后重试

3. 添加错误监听排查问题 #

给窗口添加加载错误监听，明确失败原因：

const createWindow = () => {
    const win = new BrowserWindow({
        width: 800,
        height: 600
    })
    win.loadURL('https://www.google.com/')
    
    // 监听加载错误
    win.webContents.on('did-fail-load', (event, errorCode, errorDescription) => {
        console.log('加载失败:', errorCode, errorDescription)
    })
    
    // 监听页面控制台日志
    win.webContents.on('console-message', (event, level, message) => {
        console.log('页面日志:', message)
    })
}

运行后查看终端输出的错误信息，能更精准定位问题。

4. 验证Electron版本兼容性 #

如果使用的是较旧的Electron版本，可能存在Web引擎兼容性问题，尝试更新到稳定版：

npm install electron@latest --save-dev

内容的提问来源于stack exchange，提问作者Erik Martinez Barraza