Why Front‑End and Back‑End Security Must Work Together
The article reexamines web security as a holistic system, explaining attack goals, targets, and methods across browsers, transport channels, and servers, and shows how coordinated front‑end and back‑end defenses such as encryption, signing, and input validation are essential to protect the whole web stack.
Security Across All Ends
Because of functional division in development, many people instinctively split web security into front‑end and back‑end, even debating which is more important. This article argues that such debate is meaningless and encourages a calm, holistic view.
Rethinking
The author recently reviewed web security from a front‑end perspective, acknowledging personal bias but hoping the insights benefit readers.
My Definition of Web Security
Web security is fundamentally about preventing attacks. It involves two core concepts: attack and defense . Attacks are performed by attackers; defenses are implemented by the web platform providers.
Defending From the Perspective of Attacks
1. Attack Goals
Attackers usually aim to either steal user information (credentials, personal data) or disrupt product functionality (e.g., overwhelming servers).
2. Attack Targets & Weapons
The main targets are the browser, the transmission channel, and the server. The diagram below illustrates data flow, which is both the communication backbone and a weapon for attackers.
3. The Essence of Attacks
Attacks exploit data flow to compromise one of the three targets. Defense must identify the target and protect it accordingly.
4. Defense Strategies by Target
4.1 Attacking the Transmission Channel
Two types of attacks exist: data theft and data tampering. Corresponding defenses are data encryption and parameter signing.
1. Data Encryption: Front‑end code is public, so asymmetric encryption (e.g., RSA) is used. The back‑end provides a public key and a nonce; the front‑end encrypts data before sending, and the back‑end decrypts with the private key.
2. Data Signing: For shareable URLs, sign URL parameters. If parameters are altered during transmission, the signature verification fails and the request is rejected.
4.2 Attacking the Browser
Browser attacks occur after data reaches the client. They include exploiting browser features (e.g., XSS) and front‑end logic flaws.
1. Exploiting Browser Features (XSS): When untrusted data is rendered as HTML, malicious scripts can execute. The defense is to filter and escape untrusted data before rendering.
2. Exploiting Front‑End Logic (URL Attack): If a page redirects based on an uncontrolled
targetparameter, attackers can redirect users to phishing sites. The front‑end should whitelist allowed domains.
4.3 Attacking the Server
Server attacks target backend services. They include exploiting server characteristics (e.g., SQL injection, malicious file upload) and backend logic flaws.
1. Exploiting Server Characteristics: SQL injection attacks send malicious SQL statements; the server must filter input. File upload attacks require validation, isolation, and type checking.
2. Exploiting Backend Logic: Issues such as insufficient permission checks, lack of malicious‑user detection, and improper user identity verification (e.g., CSRF) must be mitigated on the server side, often with assistance from the front‑end (e.g., token validation).
Conclusion
Web security is an end‑to‑end system. Attacks target either a single endpoint or the channel between endpoints. When the channel is the target, both front‑end and back‑end must cooperate; when the vulnerability resides in one endpoint, protection can be handled by that endpoint alone.
Tencent IMWeb Frontend Team
IMWeb Frontend Community gathering frontend development enthusiasts. Follow us for refined live courses by top experts, cutting‑edge technical posts, and to sharpen your frontend skills.
How this landed with the community
Was this worth your time?
0 Comments
Thoughtful readers leave field notes, pushback, and hard-won operational detail here.