Electron开发 - 如何在主进程Main中让node-fetch使用系统代理

背景

开发过程中,用户设置的系统代理是不同的,比如公司内的服务器,所以就要动态地使用系统代理来访问,但是主进程默认为控制台级别的请求,不走系统代理,除非你指定系统代理配置,这个就就有了这篇内容

思路

网上其实已经有了一篇文章写了这块,这里权当总结

  1. 通过 electron 自带 session 请求来判断是否走了代理,这里的 session 相当于一个渲染进程的 session,所以走的是系统代理;

  2. 通过 electron 执行 cmd 命令来返回系统代理配置,这个兼容性比较麻烦,mac,windows 各不相同,不推荐;

  3. 通过内部通信,委派渲染进程来干这件事,但是这个如果来回传递 10M 左右的数据,则会造成内存溢出,原因不详,总之通信不能进行大数据传输,electron 的 bug

  4. 综上所述,还是自带的 session 方式比较靠谱,但是遇上 mac socks5 有账号密码时,返回的不清楚是啥,还未尝试

代码实现

Electron 主进程获取系统代理代码

复制代码
async function getSystemProxy() {
    const proxyUrl = await session.defaultSession.resolveProxy('https://www.baidu.com');
    if (proxyUrl.startsWith('PROXY')) {
        const [host, port] = proxyUrl.split(' ')[1].split(':');
        console.log(proxy)
    }
}

node-fetch 使用系统代理需要借助库 `https-proxy-agent`

复制代码
const {HttpsProxyAgent} = require('https-proxy-agent');

(async () => {
    const fetch = (await import('node-fetch')).default;

    // 使用 fetch 发送请求
    fetch("https://crashlogs.whatsapp.net/wa_fls_upload_check?type=crashlog&access_token=1063127757113399%7C745146ffa34413f9dbb5469f5370b7af", {
        "headers": {
            "accept": "*/*",
            "accept-language": "zh-CN",
            "content-type": "multipart/form-data; boundary=----WebKitFormBoundary0liYTCH2BoYgSkZz",
            "sec-ch-ua": "\"Not?A_Brand\";v=\"8\", \"Chromium\";v=\"108\"",
            "sec-ch-ua-mobile": "?0",
            "sec-ch-ua-platform": "\"Windows\"",
            "Referer": "https://crashlogs.whatsapp.net/wa_fls_upload_check",
            "Origin": "https://web.whatsapp.com",
        },
        "body": "------WebKitFormBoundary0liYTCH2BoYgSkZz\r\nContent-Disposition: form-data; name=\"from_jid\"\r\n\r\nunknown-9799517833\r\n------WebKitFormBoundary0liYTCH2BoYgSkZz\r\nContent-Disposition: form-data; name=\"agent\"\r\n\r\nWhatsApp/2.3000.1014589209 Web/Chrome 108.0.5359.215 Device/Windows\r\n------WebKitFormBoundary0liYTCH2BoYgSkZz\r\nContent-Disposition: form-data; name=\"app_id\"\r\n\r\n167028690535322\r\n------WebKitFormBoundary0liYTCH2BoYgSkZz\r\nContent-Disposition: form-data; name=\"build_id\"\r\n\r\n0\r\n------WebKitFormBoundary0liYTCH2BoYgSkZz\r\nContent-Disposition: form-data; name=\"support_exception_only_upload\"\r\n\r\ntrue\r\n------WebKitFormBoundary0liYTCH2BoYgSkZz\r\nContent-Disposition: form-data; name=\"reason\"\r\n\r\n[ErrorPubSub] ServerJS based data-sjs payload content length mismatch\r\n------WebKitFormBoundary0liYTCH2BoYgSkZz--\r\n",
        "method": "POST",
        "agent": new HttpsProxyAgent('http://127.0.0.1:7890')
    }).then((response) => {
        return response.json();
    }).then((data) => {
        console.log(data);
    }).catch((e) => {
        console.error(e);
    });
})();
相关推荐
Sun_light16 分钟前
6个你必须掌握的「React Hooks」实用技巧✨
前端·javascript·react.js
爱学习的茄子18 分钟前
深度解析JavaScript中的call方法实现:从原理到手写实现的完整指南
前端·javascript·面试
莫空000018 分钟前
Vue组件通信方式详解
前端·面试
呆呆的心19 分钟前
揭秘 CSS 伪元素:不用加标签也能玩转出花的界面技巧 ✨
前端·css·html
百锦再19 分钟前
重新学习Vue中的按键监听和鼠标监听
javascript·vue.js·vue·计算机外设·click·up·down
susnm23 分钟前
Dioxus 与数据库协作
前端·rust
优雅永不过时_v28 分钟前
基于vite适用于 vue和 react 的Three.js低代码与Ai结合编辑器
前端·javascript
小皮侠29 分钟前
nginx的使用
java·运维·服务器·前端·git·nginx·github
WildBlue31 分钟前
🧊 HTML5 王者对象 Blob - 二进制世界的魔法沙漏
前端·javascript·html
啷咯哩咯啷35 分钟前
Vue3构建低代码表单设计器
前端·javascript·vue.js