DEV Community

Cover image for Build a Lightweight Web Security Scanner with Next.js: Meet WafyShield 🛡️
Afee Muhammod Wafy
Afee Muhammod Wafy

Posted on

Build a Lightweight Web Security Scanner with Next.js: Meet WafyShield 🛡️

Web security shouldn't be complicated, yet most enterprise-grade security auditing tools lock basic checks—such as SSL validation, security header analysis, and cookie security—behind confusing interfaces or expensive paid subscriptions.

In order to address this, I created WafyShield, a lightweight, fast, and serverless web security scanner designed to evaluate any public website in seconds with a strong focus on privacy and zero server-side storage.


🌐 Live Application & Source


⚡ Key Features

  • HTTPS & SSL Security Check: Confirms whether a website properly enforces secure transport and inspects TLS certificate details (such as issuer, subject, and expiration dates).
  • Security Headers Checker: Audits OWASP-recommended headers like HSTS, Content-Security-Policy (CSP), X-Frame-Options, X-Content-Type-Options, Referrer-Policy, and Permissions-Policy.
  • Cookie Security Audit: Detects cookies set by the server and verifies essential flags like Secure, HttpOnly, and SameSite.
  • Instant Security Score & Risk Level: Calculates a clear 0–100 score alongside an overall risk tier (Low, Medium, High, or Critical).
  • Remediation Guides: Provides copy-pasteable fix recommendations for every warning or failed check.
  • Client-Side History & JSON Export: Stores recent scan reports locally in the browser (localStorage) and allows exporting full reports as JSON.
  • Responsive UI & Dark Mode: A clean, green-themed interface built with a built-in dark/light mode toggle.

🛠️ Architecture & Tech Stack

  • Framework: Next.js 14 (Pages Router) for fast routing and serverless efficiency.
  • Styling: Scoped CSS-in-JS (styled-jsx) for clean component-level design without heavy UI libraries.
  • Backend & Compute: Next.js Serverless API Routes utilizing Node.js native fetch and tls modules.
  • Hosting: Vercel Serverless Functions to ensure minimal latency and zero maintenance overhead.

💡 Engineering Highlights

1. Guarding Against SSRF (Server-Side Request Forgery)

Since the server performs fetch requests on behalf of users, malicious inputs could potentially target internal or private network ranges (like localhost or 127.0.0.1). To prevent this abuse, the URL normalizer strictly blocks private and local IP addresses before making any outbound network calls.

2. Direct TLS Socket Inspection

Instead of relying on heavy third-party packages to inspect SSL certificates, WafyShield connects directly to port 443 using Node.js's built-in tls module to extract certificate metadata securely and efficiently.

3. Lightweight In-Memory Caching

To minimize redundant external requests and speed up response times for repeated lookups, an in-memory cache with a Time-To-Live (TTL) mechanism was implemented directly inside the serverless execution environment.


👨‍💻 About the Author

Built by Afee Muhammod Wafy.

For more projects, visit https://afeemuhammodwafy.com or connect on GitHub.

Top comments (0)