Front-End Security: Popular Types of Attacks

#frontend #cybersecurity #javascript #webdev

1. Cross-site scripting (XSS) attacks

It is a type of attack that injects malicious client-side code. For example, an attacker could input JavaScript that steals user cookies into a comment form that doesn't sanitize entries. When victims load the compromised page, the script executes to give the attacker access to user accounts.

Clickjacking attacks

Clickjacking attacks rank as one of the largest types of attacks under the XSS attack umbrella, as they're simply performed by replacing legitimate parts of a web page with similar-looking, yet dangerous, elements. For example, checkout buttons can be replaced with buttons redirecting users to fake banking pages, legitimate download buttons can be replaced with buttons resulting in malware downloads, and more.

Geolocation stealing

With XSS attacks, an attacker can inject JavaScript libraries, which then execute on the client side—logging the user's IP address, geolocation and other personal details. These can then be used by the attacker to target the end user with personalized scams or phishing.

Cryptomining

With code injected by an XSS attack, cryptomining can be performed on end users' devices as well. While it may already seem to slow down a single device, hundreds or thousands of users visiting a web application every day means crypto mining scripts running on your web application can unknowingly cause not only slowdowns but also heating issues on users' devices. This sort of effect on your web application can lead to a negative experience on their part.

Protection against XSS attacks can be achieved by the proper sanitization of inputs made into your web application, as well as by filtering inputs correctly. For example, limiting mobile numbers to digits only or not allowing special characters in names can yield a substantial benefit by preventing most injection attacks on your web application.

2. DoS (denial-of-service) attacks & DDoS (distributed denial-of-service)

· DOS (Denial of Service) Attack: In this attack a computer sends a massive amount of traffic to a victim’s computer and shuts it down. Dos attack is an online attack that is used to make the website unavailable for its users when done on a website. This attack makes the server of a website that is connected to the internet by sending a large number of traffic to it.

· DDOS (Distributed Denial of Service) Attack: In this attack dos attacks are done from many different locations using many systems.

Types of DOS Attacks:

Buffer overflow attacks
Ping of Death or ICMP flood
Teardrop Attack
Flooding Attack

Types of DDOS Attacks:

Volumetric Attacks
Fragmentation Attacks
Application Layer Attacks
Protocol Attack.

3. Cross-site request forgery (CSRF):

These force victims to execute unwanted actions in an app they're logged into. For example, an attacker could trick users with a disguised link that quietly transfers funds from their account using their stored credentials.

For example, a user is logged into his banking application and browsing the internet at the same time. The user then comes across a "Download" button which he clicks on, and instead of actually downloading anything for the user, that fateful click transfers funds from the user's bank account to the attacker.

4. Content Security Policy (CSP)

A Content Security Policy (CSP) is a security standard that provides an additional layer of protection from cross-site scripting (XSS), clickjacking, and other code injection attacks. It is a defensive measure against any attacks that rely on executing malicious content in a trusted web context, or other attempts to circumvent the same-origin policy.

With CSP, you can limit which data sources are allowed by a web application, by defining the appropriate CSP directive in the HTTP response header.

5. Modern Frameworks

Often, web application front ends are built using commonly available frameworks. These frameworks make up the core of your web application frontend, and any security vulnerability within this framework can lead to a compromise of your web application as a whole.
Using modern and frequently updated frameworks can help boost your web applications security. These frameworks frequently include built-in authentication handlers and other security features that help standardize the security practises needed for your web application.

6. Incorporating security from the start

Web application development generally runs for months if not years. Developers come, developers go, budgets change, ideas change and projects change direction.

During all these changes, ensuring that your project stays secure is the most important aspect to consider. Incorporating a security-first approach in your project from the very start ensures that your project will stay secure no matter what changes come along, as seen in our previous interview Builders vs Breakers: Bridging the gap Between Software Development and InfoSec with Tanya Janca.

7. Auditing of 3rd-party libraries in use

3rd-party libraries are in use everywhere. They help speed up coding time and make implementation of new features into your web application that much easier—but any possible vulnerability in these 3rd-party libraries can impact your web application's overall security as well.

For example, many web applications rely on 3rd-party libraries for handling billing and customer purchases. Any vulnerability in these billing libraries can cause multiple security issues in your web application, such as the leaking of user information or redirecting users to phishing domains to capture card details.

Keeping track of and scanning 3rd-party libraries manually can often be tricky for large web applications, but online vulnerability scanners exist to help this process along, making it straightforward, automated, and ready to alert you whenever a vulnerability is found.

8. Ensuring CDN-pulled libraries undergo subresource integrity checks

Also critical is checking whether libraries loaded via 3rd-party CDNs are intact and untouched. Many web applications load libraries off 3rd-party CDNs for quicker loading of pages and better overall performance, but if these libraries are compromised via MITM attacks or if the CDN itself is compromised, it's possible to load bad code into your web application on the user side, leading to a poor experience.

For example:

<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl" crossorigin="anonymous">
The above code loads the popular Bootstrap CSS library but includes an integrity parameter with a checksum, which can be verified by your browser. This ensures that if the CDN is compromised and the CSS file is modified, the integrity checksum will not match and the file will not render in your user's browser.

At the expense of a poorly rendered page (at most), this will help protect your web application's reputation and security, while keeping your user safe as well.