⚡️ Beyond the Browser: Mastering Electron's net Module for System-Level Networking

“Browser rules don’t apply here.”
Learn how Electron's net module gives your desktop app the networking power of system tools like curl, far beyond the limits of fetch or axios.

---

📦 Why Use Electron’s net? A Real-Life Analogy

Imagine you're at a hotel:

• fetch is like calling the front desk — they’ll help, but only within hotel rules.

• axios is like using a guest app — more features, but still limited by hotel policies (like asking for permission).

• electron.net is like having a master key and a walkie-talkie to talk to staff directly — no restrictions, no waiting, and you can do whatever the system allows.

If you’re building Electron apps that need downloads, background sync, or CORS-free APIs, electron.net is your tool.

---

🌐 Meet the Players: fetch, axios, and net

---

🔧 How to Use Each — With Examples

✅ 1. Using electron.net (System-Level, No CORS, Download Capable)

• ✅ No CORS.

• ✅ Fully controllable.

• ✅ Ideal for download managers, auto-updaters, background sync.

// main.js
const { net, app, session } = require('electron');
const fs = require('fs');
const path = require('path');

app.whenReady().then(async () => {
  // Bypass all system proxies
  await session.defaultSession.setProxy({ proxyRules: 'direct://' });

  const filePath = path.join(__dirname, 'file.pdf');
  const fileStream = fs.createWriteStream(filePath);

  const request = net.request('https://example.com/file.pdf');
  request.on('response', (res) => {
    res.on('data', chunk => fileStream.write(chunk));
    res.on('end', () => {
      fileStream.end();
      console.log('✅ Download complete');
    });
  });

  request.end();
});

---

⚡ 2. Using axios (Great for JSON APIs, but CORS-limited)

const axios = require('axios');
axios.get('https://jsonplaceholder.typicode.com/todos/1')
  .then(response => console.log('✅ axios result:', response.data))
  .catch(error => console.error('❌ axios error:', error));

• ✅ Easy to use.

• ⚠️ Subject to CORS if used in renderer.

• ⚠️ Not ideal for large binary data or file downloads.

---

🌍 3. Using fetch (Browser-Like, but Restrictive)

• ✅ Native in the renderer.

• ⚠️ Blocked by CORS unless allowed by server.

• ❌ No file streaming or disk access.

---

🔓 How to Bypass Proxy in Electron

fetch('https://jsonplaceholder.typicode.com/todos/1')
  .then(res => res.json())
  .then(data => console.log('✅ fetch result:', data))
  .catch(err => console.error('❌ fetch error:', err));

🔥 Disable All Proxy with session.setProxy

This makes all requests direct, ignoring system proxies (like corporate firewalls or VPNs).

await session.defaultSession.setProxy({ proxyRules: 'direct://' });

🌐 Restore to System Proxy

await session.defaultSession.setProxy({ mode: 'system' });

You can also set custom proxy rules like:

await session.defaultSession.setProxy({
  proxyRules: 'http=my-proxy.com:8080'
});

---

💡 When to Use What?

---

🧠 Final Thoughts

Electron’s net module is often overlooked, but it unlocks true desktop-level networking — with none of the browser baggage.

If you're serious about:

• Creating an auto-updater

• Managing downloads

• Syncing background data

• Bypassing CORS and proxy issues

...then net is your best friend.

🎯 Pro Tip: Use fetch or axios for simple frontend tasks, and delegate heavy or unrestricted networking to net in the main process.