Web Security Basics
HomeLearnWeb Security Basics
◆ Security

Web Security Basics

Web security protects both the platform and its users from attacks that exploit browser behavior, network vulnerabilities, and human trust patterns. This guide covers the fundamentals that every web-facing service should implement — HTTPS enforcement, Content Security Policy, cross-site scripting defenses, and the security headers that browsers rely on. These apply whether you're building a crypto platform or any web application handling sensitive user interactions.

Web security concept illustration showing a browser with shield icon, lock symbols, and security header labels

HTTPS: The Baseline

HTTPS encrypts the connection between a user's browser and the server. Without it, anyone on the network path (ISP, coffee shop WiFi operator, network-level attacker) can read and modify the data in transit. For crypto platforms, where users interact with wallet addresses and transaction data, HTTPS isn't optional — it's the absolute minimum.

Modern hosting platforms (including Cloudflare Pages, where CryptoSoul is deployed) provision TLS certificates automatically and redirect HTTP to HTTPS by default. The MDN Web Security documentation provides comprehensive reference material on HTTPS and the broader web security model.

What HTTPS doesn't protect against: phishing on a look-alike domain (a fake site can also have HTTPS), application-level vulnerabilities in the code, and social engineering attacks that trick users into acting against their own interest.

Content Security Policy (CSP)

CSP is an HTTP header that tells the browser which sources of content are trusted. It prevents the browser from loading scripts, styles, images, or other resources from unapproved origins.

A well-configured CSP blocks most XSS attacks by preventing injected scripts from executing. For example:

Content-Security-Policy: default-src 'self'; script-src 'self'; style-src 'self' 'unsafe-inline'; img-src 'self'

This policy says: only load scripts and default resources from the same origin, allow inline styles (necessary for some frameworks), and only load images from the same origin. Any attempt to load a script from an external domain gets blocked by the browser before it executes.

For static-generated sites, CSP is especially effective because there's no dynamic server-side rendering that might introduce unexpected content sources. The allowed sources are predictable and stable.

Cross-Site Scripting (XSS)

XSS attacks inject malicious scripts into web pages that other users then load and execute. In crypto contexts, XSS can be used to steal session tokens, redirect transactions, or display fake wallet addresses.

Three main types:

  • Stored XSS: Malicious script is saved to the server (in a comment, profile field, etc.) and served to anyone who views that content.
  • Reflected XSS: Malicious script is included in a URL parameter and reflected back in the page response. Typically delivered via a crafted link.
  • DOM-based XSS: The vulnerability exists in client-side JavaScript that processes user input without proper sanitization.

Defenses: sanitize all user input, escape output in HTML contexts, implement CSP headers, and use framework-provided protections (Vue.js, which CryptoSoul uses via Nuxt, automatically escapes template expressions by default).

Security Headers Checklist

These HTTP response headers collectively harden a site against common attack categories:

  • X-Content-Type-Options: nosniff — Prevents browsers from guessing (MIME-sniffing) the content type. Stops attacks where a file uploaded as text/plain is interpreted as executable JavaScript.
  • Referrer-Policy: strict-origin-when-cross-origin — Controls how much referrer information is sent with requests. Prevents leaking full URLs (which might contain sensitive path info) to third-party sites.
  • X-Frame-Options: DENY — Prevents the page from being embedded in iframes on other sites. Blocks clickjacking attacks.
  • Strict-Transport-Security: max-age=31536000 — Tells browsers to always use HTTPS for this domain. Prevents downgrade attacks.
  • Permissions-Policy — Restricts which browser features (camera, microphone, geolocation) the page can access. Reduces the attack surface if the page is ever compromised.
  • Content-Security-Policy — The most powerful header. Defines approved content sources as described above.
Table of security headers with their purposes: X-Content-Type-Options, Referrer-Policy, HSTS, CSP

CORS: Cross-Origin Resource Sharing

CORS controls whether a web page can make requests to a different domain. By default, browsers block cross-origin requests for security. CORS headers on the server explicitly allow specific origins to make requests.

For a static site that doesn't call external APIs (like CryptoSoul's public-facing pages), CORS is mostly a non-issue. But if you're integrating with external services or building a dApp that talks to blockchain nodes, understanding CORS prevents frustrating "blocked by CORS policy" errors.

Practical Threat Model for Crypto Users

As a crypto platform user, the threats you face through web security weaknesses include:

  • Fake login pages that harvest credentials (mitigated by bookmarking real URLs and checking certificates)
  • Wallet-draining sites that request broad token approvals through injected scripts (mitigated by CSP and careful approval reviews)
  • Man-in-the-middle attacks on unencrypted connections (mitigated by HTTPS and HSTS)
  • Clickjacking where a legitimate site is overlaid with invisible attack buttons (mitigated by X-Frame-Options)
Diagram of common web security threats for crypto users: phishing, XSS, MITM, and clickjacking with mitigation strategies

What CryptoSoul Implements

The CryptoSoul platform applies all the headers listed above. As a static-generated site on Cloudflare Pages, the attack surface is inherently smaller than a dynamic application — there's no server-side processing of user input on the public site. The Caching and Performance guide covers the CDN-level protections that complement these security measures.

For personal security practices beyond what the platform can enforce, the Wallet Safety guide covers phishing defense, transaction verification, and wallet hygiene.