OWASP Webshield Library
Practical, reusable OWASP Top 10 security controls for JavaScript applications: a framework-agnostic core library, adapters for React, Vue, Next.js and Express, and a framework-neutral server layer for Node.js.
Five runnable reference apps. Each one puts OWL to work on a real product, not on ten separate tutorial pages.
React Todo App: every A01–A10 category in one app, with a live demo
React Banking Dashboard: maker-checker approvals, a CSRF-protected vault and a role-based UI
Next.js Expense Portal: no access to colleagues' claims (IDOR), no approving your own expenses, approval limits, login CSRF, Server Actions that check their caller, encrypted bank details and an SSRF-guarded receipt import
Vue + Express Incident Desk: every A01–A10 category enforced end to end, with sign-in lockout, per-incident locks, encrypted notes and a redacted audit log
Node Secrets App: a credential vault on the core and the Node server layer, with real AES-256-GCM encryption and a real npm audit scan
The server-side examples come with tests that attack them over HTTP, and CI runs them on every change.
OWL ships with five runnable example apps that put every OWASP Top 10 category to work in a real product, rather than in separate tutorial snippets. The React Todo App shows all ten categories in one app, with a live demo, and the React Banking Dashboard adds maker-checker approvals, a CSRF-protected vault and a role-based UI. The Next.js Expense Portal tackles bugs real apps ship with, such as reading a colleague's claims, approving your own expenses, login CSRF and Server Actions that skip the caller check. The Vue + Express Incident Desk enforces every rule end to end, with sign-in lockout, per-incident locks, encrypted private notes and a redacted audit log. The Node Secrets App is a credential vault on the core and the Node server layer, with real AES-256-GCM encryption and a real npm audit dependency scan. The server-side examples come with tests that attack them over HTTP, and CI runs those tests on every change.
Every example installs and runs from its own folder:
git clone https://github.com/OWASP/www-project-webshield-library.git
cd www-project-webshield-library && npm install && npm run build
cd examples/owl-enabled-nextjs-expense-portal
npm install && npm run dev
Each example's README lists its demo accounts and the attacks to try.
Project Resources
Project Resources
Requirements
- Requires Node.js 20 or above (core, React and Vue)
- Requires Node.js 20.19+ or 22.12+ (Node, Express and Next.js adapters)
- Requires React 18 or above (React and Next.js adapters)
- Requires Vue 3.3 or above (Vue adapter)
- Requires Next.js 14 or above (Next.js adapter)
- Requires Express 4.18 or above (Express adapter)
- Core, React and Vue also run in modern browsers
Slack