DEV Community

X.T.O
X.T.O

Posted on

I Built a Browser-Based P2P File Transfer Tool Using WebRTC (No Server Upload)

#webdev #webrtc #javascript

Most file transfer tools on the internet work the same way:

  1. Upload the file to a server
  2. The server stores it
  3. The other user downloads it

This works fine, but it has some downsides:

  • Files are temporarily stored on a server
  • Upload time can be slow for large files
  • It consumes server bandwidth

So I wanted to experiment with something different.

I built a browser-based peer-to-peer file transfer tool using WebRTC.

No server storage.
No upload step.
Just direct browser-to-browser transfer.

💡 The Idea

Instead of uploading files to a server, the browsers connect directly to each other.

The file is transferred peer-to-peer using WebRTC.

Browser A  ←→  WebRTC  ←→  Browser B
Enter fullscreen mode Exit fullscreen mode

This means:

  • No server upload
  • No server storage
  • Direct encrypted connection
  • Faster transfer for many cases

Everything happens inside the browser.

⚙️ How It Works

The tool uses WebRTC DataChannels to establish a peer-to-peer connection between two users.

The process is simple:

  1. User A opens the tool and creates a session
  2. A session code is generated
  3. User B enters the same session code
  4. A WebRTC connection is established
  5. Files are transferred directly between the two browsers 
User A
  │
  │ session code
  ▼
User B
  │
  ▼
WebRTC connection
  │
  ▼
Direct file transfer
Enter fullscreen mode Exit fullscreen mode

Once connected, files move directly between both users without going through a central server.

🌐 Why WebRTC?

WebRTC is usually known for things like:

  • Video calls
  • Voice chat
  • Real-time collaboration

But it also supports DataChannels, which allow browsers to send arbitrary data directly to each other.

That makes it perfect for building peer-to-peer tools directly in the browser.

Modern browsers are much more powerful than many developers realize.

✨ Features

The tool currently supports:

  • Peer-to-peer file transfer
  • No server storage
  • Direct browser connection
  • Session code based pairing
  • Encrypted WebRTC connection

Everything runs entirely client-side.

🧪 Try It Yourself

You can try the tool here:

👉 https://xto.icu/tools/p2p-file-drop/

Open the page on two devices or two browsers, share the session code, and start transferring files.

🧠 Why I Built This

This project started as a small experiment to explore what modern browsers can do.

It's amazing that we can now build peer-to-peer applications directly in the browser without requiring users to install anything.

Just open a webpage and it works.

🔮 Next Experiments

I'm also exploring other browser-based P2P tools, such as:

  • P2P chat
  • P2P clipboard sharing
  • P2P streaming experiments
  • More WebRTC utilities

There’s a lot of interesting potential here.

💬 Feedback Welcome

If you try the tool, I would love to hear your feedback.

What features would make it more useful?

Top comments (0)