Web Application Security Architecture

Web application security is a layered control problem: every boundary — edge, browser, application, data, observability — owns a slice of the attack surface, and any single layer must be assumed to fail. This article maps the 2026 control set onto that model: where strict Content Security Policy (CSP) and Trusted Types eliminate XSS classes, where WebAuthn eliminates phishing, where Argon2id eliminates GPU-friendly cracking, and where the OWASP Top 10:2025 tells us the operational defects that still dominate breaches.

Mental model

Three claims drive every decision in this article:

1. No single control holds. Treat each layer as a probabilistic filter, not a guarantee. A WAF rule, a CSP directive, a parameterized query, and a request-time authorization check are independent — when one fails, the others must still bound the blast radius.
2. Configuration is the failure mode. The OWASP Top 10:2025 keeps Broken Access Control at #1 and elevates Security Misconfiguration to #2 — both are categories where the technology is sound and the deployment is not.¹
3. Cryptographic proof beats reputation. The 2016 Google study “CSP Is Dead, Long Live CSP!” showed that 94.72% of real CSP policies were bypassable due to allowlisted hosts that exposed JSONP or vulnerable AngularJS endpoints.² Modern controls — nonces, SRI, signed artifacts, passkeys — replace “this domain is friendly” with “this hash / signature matches”.

Foundational principles

Defense in depth

No single control is infallible. Defense in depth layers controls so that the probability of all layers failing simultaneously is negligible, even when each layer alone has known weaknesses.

The classic anti-pattern is treating one layer as load-bearing — typically a WAF as the only XSS defense. WAF signature evasion is a well-explored attack class (e.g., HTML-spec edge cases, mutation-XSS payloads) and a WAF cannot sandbox JavaScript executed by a real DOM. The right position is: WAF is a coarse pre-filter, CSP is the structural control, output encoding is the per- sink control, and Trusted Types removes the unsafe sinks entirely.

Least privilege

Grant the minimum permissions a task requires, scoped tightly enough that a compromise has narrow blast radius.

1const servicePermissions = {2  "api-read-service": {3    database: ["SELECT"],4    tables: ["users", "products"],5    columns: { users: ["id", "name", "email"] },6  },7  "api-write-service": {8    database: ["INSERT", "UPDATE"],9    tables: ["orders", "cart"],10  },11}

The harder version of this principle is temporal least privilege: grant elevated rights for a bounded window (just-in-time), then revoke. Persistent admin grants for occasional needs are how a routine credential leak becomes a domain-admin event.

Fail secure

Errors in security-critical code paths must default to deny. Attackers deliberately craft inputs that drive code into exception paths.

1async function checkAccessSecure(userId, resource) {2  try {3    const allowed = await authService.check(userId, resource)4    return allowed === true5  } catch (error) {6    logger.error("Auth check failed", { userId, resource, error: error.message })7    return false8  }9}

OWASP Top 10:2025

The 2025 edition was published in November 2025 and is the eighth installment of the list.¹ It capped each category at 40 mapped CWEs, consolidated SSRF into Broken Access Control, and introduced two new categories driven by recent breach patterns: A03 Software Supply Chain Failures (broadened from the 2021 “Vulnerable and Outdated Components”) and A10 Mishandling of Exceptional Conditions.¹

A01: Broken Access Control

OWASP reports an average incidence rate of 3.73% across tested applications, mapped to 40 CWEs.³ Authorization logic is scattered across handlers; the fix is structural, not local.

1const requireOwnership = (resourceType) => async (req, res, next) => {2  const resourceId = req.params.id3  const userId = req.user.id45  const isOwner = await checkOwnership(userId, resourceType, resourceId)6  const isAdmin = req.user.roles.includes("admin")78  if (!isOwner && !isAdmin) {9    logger.warn("Access denied", { userId, resourceType, resourceId })10    return res.status(403).json({ error: "Access denied" })11  }12  next()13}1415app.get(16  "/api/users/:id/documents",17  authenticate,18  requireOwnership("user"),19  async (req, res) => {20    const documents = await db.documents.findByUserId(req.params.id)21    res.json(documents)22  },23)

The structural rule is: every route reads its authorization from a single named policy. Inline if (req.user.id === resource.ownerId) checks are how endpoints silently drift out of the policy.

OWASP’s consolidation of SSRF into A01 reflects a shared root cause: the server makes a privileged decision (whether to fetch this URL) on behalf of the user without verifying the resulting resource is one the user is authorized to reach.¹ We come back to SSRF in Attack vectors.

A02: Security Misconfiguration

Defaults are tuned for developer ergonomics, not production. The most common misconfigurations:

A baseline Express configuration that fixes the common defaults:

1import express from "express"2import helmet from "helmet"3import rateLimit from "express-rate-limit"45const app = express()67app.use(8  helmet({9    contentSecurityPolicy: {10      directives: {11        defaultSrc: ["'self'"],12        scriptSrc: ["'self'"],13        styleSrc: ["'self'", "'unsafe-inline'"],14        imgSrc: ["'self'", "data:", "https:"],15        objectSrc: ["'none'"],16        frameAncestors: ["'none'"],17      },18    },19    hsts: { maxAge: 31536000, includeSubDomains: true, preload: true },20  }),21)2223app.use(24  rateLimit({25    windowMs: 15 * 60 * 1000,26    max: 100,27    standardHeaders: true,28    legacyHeaders: false,29  }),30)3132app.use(express.json({ limit: "100kb" }))3334app.use((err, req, res, next) => {35  logger.error("Request error", { error: err.message, requestId: req.id })36  res.status(500).json({ error: "Internal error", requestId: req.id })37})

A03: Software Supply Chain Failures

Direct dependencies are the smallest part of the attack surface. A typical Node.js application’s transitive graph runs into hundreds of packages, any of which is a credential-harvesting opportunity if the maintainer account is compromised. Recent representative incidents include the event-stream 2018 takeover and the xz-utils 2024 backdoor. The 2025 OWASP entry broadened the framing from “vulnerable components” to the full pipeline: typosquatting, dependency confusion, maintainer account compromise, and CI/CD artifact tampering.¹

Baseline mitigations:

1{2  "scripts": {3    "audit": "npm audit --audit-level=high",4    "audit:signatures": "npm audit signatures",5    "sbom": "npx @cyclonedx/cyclonedx-npm --output-file sbom.json"6  }7}

For browser-loaded third-party assets, Subresource Integrity (SRI) gives cryptographic proof that the served bytes match what was reviewed:

1<script2  src="https://cdn.example.com/lib.js"3  integrity="sha384-oqVuAfXRKap7fdgcCY5uykM6+R9GqQ8K/uxy9rx7HNQlGYl1kPzQho1wx4JwY8wC"4  crossorigin="anonymous"5></script>

SRI supports sha256, sha384, and sha512 digests and requires crossorigin because the browser must fetch the resource using the CORS protocol to compute and compare the hash.⁴ The Integrity-Policy response header (now in the SRI spec) lets a site enforce that all matching subresources carry an integrity attribute, surfacing accidental regressions instead of silently loading unverified bytes.

A04: Cryptographic Failures

The 2025 edition retains the broad framing: “data in transit and at rest must be encrypted with current algorithms; sensitive data must not exist in places it doesn’t need to.” The OWASP Password Storage Cheat Sheet gives the current canonical choices:

OWASP publishes five equivalent Argon2id profiles that trade memory for time; pick the highest-memory profile the host can sustain, then bump timeCost instead of dropping memory further.⁵

1import { hash, verify } from "@node-rs/argon2"23async function hashPassword(password) {4  return await hash(password, {5    memoryCost: 47104,6    timeCost: 1,7    parallelism: 1,8  })9}1011async function verifyPassword(password, hashedPassword) {12  return await verify(hashedPassword, password)13}

Why Argon2id over bcrypt. Argon2 won the 2015 Password Hashing Competition explicitly to resist hardware-accelerated attacks: its memoryCost parameter forces each guess into a memory-bound region, neutering the GPU and ASIC parallelism advantage that wrecks CPU-bound functions.⁶ bcrypt remains acceptable for legacy systems but caps password input at 72 bytes (Blowfish’s 18-entry × 4-byte P-array) — modern implementations transparently truncate, which can silently mask password-length policies.

A05: Injection

Untrusted data interpreted as code, across many command surfaces:

1const query = `SELECT * FROM users WHERE email = '${email}'` // VULNERABLE23const [rows] = await db.execute(4  "SELECT * FROM users WHERE email = ?",5  [email],6)

1import { execFile } from "child_process"2import { promisify } from "util"34const execFileAsync = promisify(execFile)56async function ping(host) {7  if (!/^[a-zA-Z0-9.-]+$/.test(host)) {8    throw new Error("Invalid hostname")9  }10  const { stdout } = await execFileAsync("ping", ["-c", "4", host])11  return stdout12}

A06–A10 in one pass

Security headers

HTTP security headers move policy enforcement from the application into the browser. They are cheap (set once at the edge), composable, and they catch classes of bug that application-side fixes miss.

Content Security Policy (CSP)

CSP Level 3 is a W3C Working Draft (most recently published 2026-04-21) that restricts where a page may load and execute scripts, styles, and other resources.⁷

Why allowlists fail. The seminal Google study analyzed ~26,000 distinct real CSPs and found 94.72% were trivially bypassable; 75.81% used script allowlists that included a host serving an exploitable JSONP endpoint or a vulnerable AngularJS version.² The fix is to invert trust: authenticate every script execution with a per-response cryptographic nonce, and let 'strict-dynamic' propagate trust transitively.

1Content-Security-Policy:2  default-src 'self';3  script-src 'self' 'nonce-R4nd0mN0nc3' 'strict-dynamic';4  style-src 'self' 'nonce-R4nd0mN0nc3';5  object-src 'none';6  base-uri 'self';7  frame-ancestors 'none';8  report-to csp-endpoint

The mechanism, in four steps:

1. Generate a fresh nonce per response (≥ 128 bits, base64-encoded).
2. Serve it both in the CSP header and on every legitimate inline / external <script> tag the page emits.
3. Browser executes only scripts whose nonce attribute matches.
4. 'strict-dynamic' lets a trusted script load further scripts without listing every URL — the trust travels with the parser-inserted relationship, not with the URL.

1import crypto from "crypto"23function generateCSP(req, res, next) {4  const nonce = crypto.randomBytes(16).toString("base64")5  res.locals.nonce = nonce67  res.setHeader(8    "Content-Security-Policy",9    [10      "default-src 'self'",11      `script-src 'self' 'nonce-${nonce}' 'strict-dynamic'`,12      `style-src 'self' 'nonce-${nonce}'`,13      "object-src 'none'",14      "base-uri 'self'",15      "frame-ancestors 'none'",16    ].join("; "),17  )1819  next()20}

Trusted Types

Trusted Types close the DOM-XSS gap CSP cannot reach: they refuse to let raw strings reach injection sinks like Element.innerHTML, document.write, or eval. As of February 2026 the API is Baseline across all major browsers — Chrome and Edge since 83, Firefox since 148, Safari since 26.⁸

1Content-Security-Policy: require-trusted-types-for 'script'; trusted-types myPolicy

1const policy = trustedTypes.createPolicy("myPolicy", {2  createHTML: (input) => DOMPurify.sanitize(input),3  createScript: () => {4    throw new Error("Scripts not allowed")5  },6  createScriptURL: (input) => {7    const url = new URL(input, location.origin)8    if (url.origin !== location.origin) {9      throw new Error("Cross-origin scripts not allowed")10    }11    return url.toString()12  },13})1415element.innerHTML = policy.createHTML(userInput)

A 2021 Google internal review estimated Trusted Types would have prevented at least 61% of DOM XSS vulnerabilities reported through Google’s Vulnerability Reward Program, including bugs missed by static analysis pipelines.⁹ Its value is structural: instead of asking every developer to remember to sanitize, the browser refuses to render the unsanitized result.

HTTP Strict Transport Security (HSTS)

RFC 6797 lets a server tell browsers to only ever connect over HTTPS for a given host. Once latched, the policy survives until max-age expires.

1Strict-Transport-Security: max-age=31536000; includeSubDomains; preload

Other essential headers

1X-Content-Type-Options: nosniff2X-Frame-Options: DENY3Referrer-Policy: strict-origin-when-cross-origin4Permissions-Policy: camera=(), microphone=(), geolocation=()5Cross-Origin-Opener-Policy: same-origin6Cross-Origin-Embedder-Policy: require-corp

Authentication and session security

WebAuthn (passkeys)

WebAuthn Level 3 reached W3C Candidate Recommendation Snapshot status on 2026-01-13.¹⁰ The model is public-key cryptography per origin: the authenticator (TPM, Secure Enclave, hardware key, or platform passkey) generates a keypair bound to the relying-party origin, and the private key never leaves the device.

1async function registerPasskey(userId, userName) {2  const challenge = await fetch("/api/webauthn/challenge").then((r) => r.json())34  const credential = await navigator.credentials.create({5    publicKey: {6      challenge: Uint8Array.from(challenge.value, (c) => c.charCodeAt(0)),7      rp: { name: "Example Corp", id: "example.com" },8      user: {9        id: Uint8Array.from(userId, (c) => c.charCodeAt(0)),10        name: userName,11        displayName: userName,12      },13      pubKeyCredParams: [14        { alg: -7, type: "public-key" },   // ES25615        { alg: -257, type: "public-key" }, // RS25616      ],17      authenticatorSelection: {18        authenticatorAttachment: "platform",19        userVerification: "required",20        residentKey: "required",21      },22      timeout: 60000,23    },24  })2526  await fetch("/api/webauthn/register", {27    method: "POST",28    body: JSON.stringify({29      id: credential.id,30      rawId: btoa(String.fromCharCode(...new Uint8Array(credential.rawId))),31      response: {32        clientDataJSON: btoa(33          String.fromCharCode(...new Uint8Array(credential.response.clientDataJSON)),34        ),35        attestationObject: btoa(36          String.fromCharCode(...new Uint8Array(credential.response.attestationObject)),37        ),38      },39    }),40  })41}

Passkeys are phishing-resistant by construction: the authenticator verifies the relying party’s rpId against the origin the browser is on, so a credential issued for example.com will silently refuse to sign for exarnple.com. There is no password to phish, no shared secret to exfiltrate from a server dump, and discoverable credentials (residentKey: required) power the username-less sign-in flow.

Secure session cookies

1const sessionOptions = {2  name: "__Host-session",3  secret: process.env.SESSION_SECRET,4  cookie: {5    httpOnly: true,6    secure: true,7    sameSite: "strict",8    maxAge: 15 * 60 * 1000,9    path: "/",10  },11  resave: false,12  saveUninitialized: false,13}

The __Host- prefix is enforced by the browser per RFC 6265bis: the cookie must be Secure, must have Path=/, and must not carry a Domain attribute — eliminating the entire class of “subdomain takeover sets a cookie that the parent trusts” attacks.

SameSite semantics:

Token storage

HttpOnly cookies are inaccessible to JavaScript, so a successful XSS cannot read them; SameSite=Strict blocks cross-origin requests from including the cookie, neutralizing CSRF; Secure keeps them off plaintext channels. The combination of all three is the strongest stock defense the platform offers.

Attack vectors and defenses

Cross-Site Scripting (XSS)

DOM XSS is the variant strict CSP cannot directly catch — it lives in strings flowing into innerHTML, eval, setTimeout(string), and similar sinks. Trusted Types fixes this at the platform layer:

1document.getElementById("output").innerHTML = userInput // VULNERABLE23const policy = trustedTypes.createPolicy("sanitizer", {4  createHTML: (input) => DOMPurify.sanitize(input),5})6document.getElementById("output").innerHTML = policy.createHTML(userInput)

Cross-Site Request Forgery (CSRF)

CSRF turns a victim’s authenticated session into the attacker’s submission mechanism: the victim’s browser is tricked into making a state-changing request, and the cookie rides along automatically.

Defense layers (all three together, not pick-one):

1. SameSite cookies (Strict for auth, Lax for general state).
2. Synchronizer / double-submit token for state-changing requests.
3. Origin / Referer validation as a coarse server-side check.

1import { doubleCsrf } from "csrf-csrf"23const { doubleCsrfProtection, generateToken } = doubleCsrf({4  getSecret: () => process.env.CSRF_SECRET,5  cookieName: "__Host-psifi.x-csrf-token",6  cookieOptions: { sameSite: "strict", httpOnly: true, secure: true, path: "/" },7  size: 64,8  getTokenFromRequest: (req) => req.headers["x-csrf-token"],9})1011app.get("/form", (req, res) => {12  const token = generateToken(req, res)13  res.render("form", { csrfToken: token })14})1516app.post("/transfer", doubleCsrfProtection, (req, res) => {17  processTransfer(req.body)18})

Server-Side Request Forgery (SSRF)

SSRF induces the server to make a request the attacker could not make themselves, typically to an internal service the attacker cannot route to. It is now folded into A01 because the underlying defect is authorization: the server makes the request without verifying the destination is one the caller is allowed to reach.¹

Common high-value SSRF targets:

A robust outbound URL validator combines a deny list with post-resolution IP checks (because hostnames lie) and re-resolution before reconnect (because of DNS rebinding):

1import { URL } from "url"2import dns from "dns/promises"34const BLOCKED_HOSTS = new Set([5  "169.254.169.254",6  "metadata.google.internal",7  "localhost",8  "127.0.0.1",9])1011const PRIVATE_RANGES = [12  { start: 0x0a000000, end: 0x0affffff }, // 10.0.0.0/813  { start: 0xac100000, end: 0xac1fffff }, // 172.16.0.0/1214  { start: 0xc0a80000, end: 0xc0a8ffff }, // 192.168.0.0/1615]1617export async function isAllowedUrl(urlString) {18  const url = new URL(urlString)1920  if (!["http:", "https:"].includes(url.protocol)) return false21  if (BLOCKED_HOSTS.has(url.hostname)) return false2223  const addresses = await dns.resolve4(url.hostname)24  for (const addr of addresses) {25    const ip = addr26      .split(".")27      .reduce((acc, oct) => (acc << 8) + parseInt(oct, 10), 0)28    if (PRIVATE_RANGES.some((r) => ip >= r.start && ip <= r.end)) {29      return false30    }31  }3233  return true34}

Security by rendering strategy

Different rendering strategies expose different attack surfaces; the control set should follow.

A SPA running an API behind a CDN inherits all three concern sets — the build pipeline of the SSG, the runtime sinks of the CSR, and the session/auth surface of the SSR backend.

Practical takeaways

• Centralize authorization in middleware. Inline if (req.user.id === resource.ownerId) checks are how endpoints quietly drift out of policy.
• Strict CSP, not allowlists. Per-response nonces plus 'strict-dynamic' beat any reasonable host allowlist.² Pair with Trusted Types to close the DOM-XSS gap.
• Argon2id at the OWASP profile. Lower the memory only when hardware cannot sustain it, and bump the time cost in compensation.⁵
• Passkeys over passwords for new flows. Phishing resistance is built in; no shared secret to leak.
• Use the __Host- prefix and SameSite=Strict for session cookies. Replace any current csurf usage with a maintained alternative.
• Treat the supply chain as part of the runtime. SBOM + signature verification + SRI for browser-loaded third-party assets.
• Validate outbound URLs after DNS resolution, then pin the socket to the resolved IP. Hostname allow-lists alone do not stop DNS rebinding.

Appendix

Prerequisites

• HTTP fundamentals (headers, methods, status codes, cookies).
• Same-origin policy and CORS.
• Public-key cryptography fundamentals (asymmetric vs symmetric, hashing).
• Node.js / browser JavaScript familiarity.

Terminology

• CSP — Content Security Policy; browser-enforced loading restrictions.
• CSRF — Cross-Site Request Forgery; tricks an authenticated user into a request.
• HSTS — HTTP Strict Transport Security; forces HTTPS.
• IDOR — Insecure Direct Object Reference; unauthorized resource access via ID manipulation.
• OWASP — Open Worldwide Application Security Project.
• SBOM — Software Bill of Materials.
• SRI — Subresource Integrity; cryptographic verification of subresources.
• SSRF — Server-Side Request Forgery.
• WAF — Web Application Firewall.
• XSS — Cross-Site Scripting.

References

• OWASP Top 10:2025 — Introduction
• OWASP Top 10:2025 — A01 Broken Access Control
• OWASP Password Storage Cheat Sheet
• OWASP CSP Cheat Sheet
• W3C CSP Level 3
• W3C Trusted Types
• W3C WebAuthn Level 3
• W3C Subresource Integrity 2
• RFC 6797 — HSTS
• RFC 6265bis — Cookies
• NIST SP 800-38D — AES-GCM
• Password Hashing Competition
• Mozilla Observatory
• SSL Labs Server Test