DEV Community

Cover image for I built a "Privacy Firewall" for ChatGPT using Next.js 15 & WebAssembly (100% Offline)
Arpit Singhal
Arpit Singhal

Posted on

I built a "Privacy Firewall" for ChatGPT using Next.js 15 & WebAssembly (100% Offline)

I use ChatGPT and Claude daily for coding. But last week, I had a mini heart attack.

I was debugging a server log and pasted a huge block of text into the chat. Right before I hit "Enter," I realized the log contained a live Stripe Secret Key and three customer email addresses.

If I had sent that, it would have been in OpenAI's training logs forever.

I looked for tools to "scrub" text, but they all required me to paste my data into their website first. Sending my secrets to a random server to clean them defeated the whole purpose.

So, I spent the weekend building my own.

Meet CleanMyPrompt

CleanMyPrompt.io is a browser-based utility that acts as a middleware between your clipboard and your AI.

It runs entirely client-side. You can load the page, turn off your Wi-Fi, and it still works perfectly.

The Problem: Accidental Leaks

We get lazy. We CMD+A, CMD+C, CMD+V.
But LLMs ingest everything:

  • sk-live-... (API Keys)
  • user@company.com (PII)
  • 192.168.1.1 (Internal IPs)

The Solution: Client-Side Processing

I built this using Next.js 15. To ensure privacy, I made a strict architectural decision: No API Routes for text processing.

Everything happens in the browser memory using JavaScript Regex and WebAssembly.

1. The Redaction Logic (Regex)

Here is a snippet of how the cleaner handles API keys locally. It looks for common patterns (like standard AWS or Stripe prefixes) and replaces them before the text creates a finalized string.

// Example: Detecting a Stripe Key pattern
const stripeRegex = /sk_live_[0-9a-zA-Z]{24}/g;

const cleanText = (input) => {
  // Simple chain to scrub sensitive data
  return input
    .replace(stripeRegex, '[REDACTED_STRIPE_KEY]')
    .replace(/\b[\w\.-]+@[\w\.-]+\.\w{2,4}\b/g, '[EMAIL_REDACTED]')
    .replace(/(?:[0-9]{1,3}\.){3}[0-9]{1,3}/g, '[IP_ADDRESS]');
}
Enter fullscreen mode Exit fullscreen mode

2. Local OCR with WebAssembly

I also wanted to grab text from screenshots (like error modals). Instead of using a cloud Vision API, I used Tesseract.js.

It loads the OCR engine as a WASM binary in a web worker. This means even image processing happens on your machine, not a cloud GPU.

The Stack
Framework: Next.js 15 (App Router)

UI: Tailwind CSS + Shadcn/UI

Icons: Lucide React

OCR: Tesseract.js (WASM)

Deployment: Vercel

Try it out (Break it!)
I’ve launched the MVP today. It’s free and doesn't require a login.

If you are paranoid about data privacy like me, give it a try next time you need to paste a log or code snippet into ChatGPT.

Live Tool: https://cleanmyprompt.io

Let me know if you find any edge cases where the regex fails!

Top comments (1)

Collapse
 
arpit_singhal_2c86c804a6d profile image
Arpit Singhal

Thanks for reading! If anyone has better Regex patterns for detecting IPv6 addresses, let me know. That was the hardest part to get right.