DEV Community

Cover image for How I Built a Client-Side Shield for AI Chatbots (Open Source)
Frank man Video
Frank man Video

Posted on

How I Built a Client-Side Shield for AI Chatbots (Open Source)

I was burning through API tokens on off-topic chatbot queries.

Every "Who are you?" = brand leak + wasted money.

So I built Shield by Vouch — a zero-cost, client-side filter that blocks prompt injections and off-topic queries before they hit your LLM.

The Problem

You build an AI chatbot for your business. Users ask:

  • "Who are you?" → Reveals it's ChatGPT
  • "Python code for calculator" → Wastes API tokens
  • "Ignore previous instructions" → Prompt injection

Every off-topic query = $0.002 gone. 1000 queries = $2 burned.

Why Client-Side?

Server-Side Client-Side
Latency: ~100-500ms Latency: 0ms
Cost: API call already made Cost: Zero if blocked

Auto-Healing Backend

  • Paste any API key → Auto-detects provider (OpenAI, Groq, Gemini, Anthropic, OpenRouter)
  • Model fails → Auto-switches to fallback
  • Cross-provider failover → Zero downtime

Code Example

const shield = new VouchShield({
  businessType: 'restaurant',
  businessDesc: 'Italian food in Mumbai'
});

const result = shield.check("Who are you?");
// { blocked: true, response: "I can only help with our restaurant services..." }
Enter fullscreen mode Exit fullscreen mode

Results
80% off-topic queries blocked client-side
Zero identity leaks
$2 saved per 1000 blocked queries
Try It
🚀 Live Demo
GitHub
MIT License. No signup. Single file drop-in.

Top comments (0)