🔒 FrameGuard

🎯 Overview

FrameGuard is a powerful Chrome extension that helps developers and security researchers identify vulnerabilities in modern JavaScript framework applications. With one-click scanning, detect exposed API keys, secrets, and security risks in Next.js, React, Vue, and 9+ other frameworks.

Why FrameGuard?

• 🚀 One-Click Scanning - No complex setup or configuration
• 🔐 Secret Detection - Find exposed AWS keys, Stripe secrets, JWT tokens, and more
• 🗺️ Route Discovery - Automatically extract all application routes and endpoints
• ✅ Status Verification - Real-time HTTP status checking for every route
• 🎯 Framework-Specific - Optimized for Next.js, Nuxt, React, Vue, and more
• 🔒 Privacy-First - 100% local analysis, zero tracking, no data collection
• 💰 Free Forever - No premium tiers, no subscriptions, no hidden costs

✨ Features

🔍 Secret Detection

Automatically scans JavaScript bundles for exposed sensitive data:

• Google API Keys (AIza...)
• AWS Access Keys (AKIA...)
• Stripe Keys (sk_live..., pk_test...)
• GitHub Tokens (ghp_...)
• Slack Tokens (xox...)
• JWT Tokens (eyJ...)
• Custom secret patterns

🗺️ Route Discovery

Intelligently extracts application routes from:

• Framework routing files
• API endpoints
• Dynamic routes with parameters
• Server-side routes
• Client-side navigation

Smart Classification:

• 📄 Pages - Frontend routes
• 🔌 API - Backend endpoints
• ⚡ Dynamic - Parameterized routes
• 🔐 Sensitive - Admin, auth, payment paths

✅ Real-Time Status Verification

Automatically checks HTTP status of every discovered route:

• 🟢 200 - Accessible
• 🟡 404 - Not found
• 🔴 403 - Forbidden
• 🔴 401 - Unauthorized
• 🔴 5xx - Server errors

Click any badge to manually refresh the status.

📊 Risk Assessment

Automatic security scoring based on:

• Number and severity of exposed secrets
• Presence of sensitive routes
• API endpoint exposure
• Overall security posture

Risk Levels: LOW • MEDIUM • HIGH

🎨 Professional Interface

• Clean, modern dark theme
• Organized tabs: Files / Findings / Routes
• Advanced filtering and search
• One-click copy for secrets
• Export functionality
• Full-screen mode

🚀 Installation

From Chrome Web Store (Recommended)

1. Visit Chrome Web Store - FrameGuard
2. Click "Add to Chrome"
3. Confirm installation
4. FrameGuard icon appears in your toolbar

From Source (For Developers)

# Clone the repository
git clone https://github.com/31337CyberLabs/frameguard.git
cd frameguard

# Load in Chrome
# 1. Open chrome://extensions/
# 2. Enable "Developer mode"
# 3. Click "Load unpacked"
# 4. Select the frameguard folder

📖 Usage

Basic Workflow

1. Navigate to any JavaScript framework website
2. Click the FrameGuard extension icon
3. Click "Scan" to analyze the application
4. Review results in three organized tabs

Detailed Guide

1. Files Tab

View all JavaScript files loaded by the application:

• Click any file to see its contents
• Copy file URLs
• Open files in new tabs

2. Findings Tab

See all detected secrets and vulnerabilities:

• Click file name to view code snippets with line numbers
• One-click copy button for each secret (copies full value)
• Color-coded severity badges (HIGH/MEDIUM/LOW)
• Direct links to affected files

3. Routes Tab

Explore discovered application routes:

• Automatic status checking on load
• Filter by type: All / Pages / API / Dynamic / Sensitive
• Search functionality
• Click route to navigate
• Click status badge to refresh
• Copy all routes at once

🛠️ Supported Frameworks

FrameGuard is optimized for:

Works with:

• Create React App (CRA)
• Vite
• Webpack
• Turbopack
• And more...

🎯 Use Cases

For Developers 👨‍💻

Pre-Deployment Security Checks:

✅ Scan staging before production
✅ Verify no secrets are exposed
✅ Check route protection
✅ Ensure proper authentication

For Security Researchers 🔐

Vulnerability Assessment:

✅ Quick reconnaissance
✅ Framework fingerprinting
✅ Route enumeration
✅ Secret exposure verification

For Bug Bounty Hunters 🏆

Efficient Hunting:

✅ Fast initial reconnaissance
✅ Discover hidden endpoints
✅ Identify exposed credentials
✅ Map application structure

For DevOps Teams 🛠️

Continuous Monitoring:

✅ Regular security scans
✅ Compliance verification
✅ Security baseline tracking
✅ Team security awareness

🔒 Privacy & Security

FrameGuard is built with privacy as the top priority:

• ✅ 100% Local Analysis - All scanning happens in your browser
• ✅ Zero Data Collection - No telemetry, no analytics, no tracking
• ✅ No External Connections - Never sends data to any server
• ✅ No Account Required - Works instantly without sign-up
• ✅ Open Source - Code is available for security audits
• ✅ User-Initiated Only - Never runs automatically

What FrameGuard NEVER does:

• ❌ Send your data anywhere
• ❌ Track your browsing
• ❌ Store your findings on servers
• ❌ Share information with third parties
• ❌ Inject ads or marketing

📊 Technical Details

Architecture

┌─────────────────────────────────────────────┐
│           Chrome Extension                  │
├─────────────────────────────────────────────┤
│                                             │
│  ┌──────────┐  ┌──────────┐  ┌──────────┐   │
│  │ Content  │  │  Popup   │  │ Service  │   │
│  │ Script   │  │    UI    │  │  Worker  │   │
│  └──────────┘  └──────────┘  └──────────┘   │
│       │              │              │       │
│       └──────────────┴──────────────┘       │
│                      │                      │
│                Local Storage                │
│                                             │
└─────────────────────────────────────────────┘
                      │
              ┌───────┴───────┐
              │               │
         Local Page      Local Analysis
         (No Server)     (No Cloud)

Detection Patterns

Secret Patterns (Regex-based):

Google API Key:    /AIza[0-9A-Za-z\-_]{35}/g
AWS Access Key:    /AKIA[0-9A-Z]{16}/g
Stripe Secret:     /sk_(live|test)_[0-9a-zA-Z]{16,}/g
GitHub Token:      /ghp_[0-9A-Za-z]{36,}/g
Slack Token:       /xox[baprs]-[0-9A-Za-z-]{10,}/g
JWT Token:         /eyJ[a-zA-Z0-9_-]+\.[a-zA-Z0-9_-]+\.[a-zA-Z0-9_-]+/g

Route Detection:

• Framework-specific patterns
• API endpoint discovery
• Dynamic route parsing
• Server route extraction

Performance

• Scan Speed: ~10 seconds for typical applications
• File Limit: Up to 60 JavaScript files per scan
• Memory Usage: ~50-100MB during active scan
• CPU Impact: Minimal (local processing)

🤝 Contributing

We welcome contributions! Here's how you can help:

Ways to Contribute

1. 🐛 Report Bugs - Open an issue with details
2. 💡 Suggest Features - Share your ideas
3. 📝 Improve Documentation - Help others understand
4. 🔧 Submit Pull Requests - Fix bugs or add features
5. ⭐ Star the Project - Show your support

Development Setup

# Fork and clone
git clone https://github.com/31337CyberLabs/frameguard.git
cd frameguard

# Create a branch
git checkout -b feature/amazing-feature

# Make your changes
# ...

# Test locally
# Load unpacked extension in Chrome

# Commit and push
git commit -m "Add amazing feature"
git push origin feature/amazing-feature

# Open a Pull Request

🐛 Troubleshooting

Common Issues

Extension doesn't detect framework:

• Ensure the page has fully loaded
• Try rescanning the page
• Check if it's a supported framework

No secrets found:

• Great! Your app might be secure
• Try scanning different pages
• Check if secrets are in external scripts

Routes not showing:

• Framework might use non-standard routing
• Try navigating through the app first
• Some routes may be lazy-loaded

Status checks failing:

• CORS restrictions may block requests
• Some routes require authentication
• Click badge to manually refresh

Getting Help

• 📖 Check Documentation
• 💬 Open an Issue
• 📧 Email: contact@31337cyberlabs.com

📄 License

This project is licensed under the MIT License - see the LICENSE file for details.