Information Security 13 min read

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.

Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Why Front‑End and Back‑End Security Must Work Together

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

target

parameter, 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.

backendfrontenddefenseWeb Securityattack vectors
Tencent IMWeb Frontend Team
Written by

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.

0 followers
Reader feedback

How this landed with the community

login Sign in to like

Rate this article

Was this worth your time?

Sign in to rate
Discussion

0 Comments

Thoughtful readers leave field notes, pushback, and hard-won operational detail here.