如何修复Electron.js中OAuth登录校验时Axios GET请求失效的问题

问题根因 #

• 你当前是在Electron主进程（Node.js环境）中发起Axios请求，withCredentials配置仅在浏览器/Chromium渲染进程环境下生效，Node环境没有自动携带、存储Cookie的原生机制，请求不会自动带上你在授权窗口中登录后生成的会话Cookie。
• 校验逻辑时序存在问题：应用启动后直接调用校验接口，此时用户尚未完成OAuth登录操作，自然没有有效会话Cookie，会被服务端判定为未授权。
• 服务端CORS配置仅允许http://localhost:3000来源的请求，若你Electron渲染进程使用file://协议加载本地资源，来源为null，会触发跨域拦截。

解决方案 #

方案1（推荐）：将登录校验逻辑移到渲染进程执行 #

1. 把getUserDetails调用放到Electron应用的渲染层代码中执行，渲染进程是Chromium环境，和普通浏览器行为一致，withCredentials会自动携带同域下的会话Cookie。
2. 修改服务端CORS配置，适配Electron的来源：

// 服务端index.js的cors配置修改为
app.use(
  cors({
    origin: ['http://localhost:3000', 'null'], // 新增null适配file://协议的来源
    methods: 'GET,HEAD,PUT,PATCH,POST,DELETE',
    credentials: true
  })
)

3. 调整逻辑时序：先弹出授权窗口让用户完成登录，登录成功跳转后再触发登录校验接口。

方案2：主进程请求手动携带Cookie #

如果必须在主进程执行校验，需要手动从Electron会话中获取登录后的Cookie，再注入到Axios请求头中：

// 修改主进程中的getUserDetails调用逻辑
const { session } = require('electron');

async function getUserDetailsWithCookie() {
  // 从默认会话中获取localhost:4000下的所有Cookie
  const cookies = await session.defaultSession.cookies.get({ url: 'http://localhost:4000' });
  const cookieStr = cookies.map(c => `${c.name}=${c.value}`).join('; ');
  
  return axios.get('http://localhost:4000/', {
    headers: { Cookie: cookieStr }
  });
}

额外优化 #

给showWindow函数添加错误捕获，避免未处理的Promise报错：

async function showWindow() {
  console.log('showWindow Started!');
  try {
    const response = await getUserDetails()
    console.log(response.status);
    if (response.status === 200) {
      console.log('Success!');
      return createAppWindow();
    } else {
      createAuthWindow();
      throw new Error('Failed to authenticate user.');
    }
  } catch (err) {
    console.error('校验登录状态失败:', err);
    createAuthWindow();
  }
}

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