Complete Guide to Web Security: Prevent XSS, Clickjacking, and Sniffing Attacks in Node.js

First tell me what do you mean by secure .It means the if some hacker tries to access our website he should not be able to do that . Means there are lot of ways through which your website can be attacked like

→ XSS attack
→ clickJacking
→ sniffing

So these are some kind of attacks to which a website should be capable of preventing other wise the user’s security will get hampered

In this article we will study each and every type of attack completely and will be understanding the working of that particular attack.

1. What is Xss ?
2. How many type of Xss attacks are there ?
3. Understanding how these attacks happen .
4. What damage these attacks can cause ?
5. How to protect our website from these attacks ?

What is XSS ?

Xss means cross site scripting

This is a kind of attack where user takes benefit of the forms which are present in your website . In this attack user tries to inject html or javascript code into your codebase via vulnerable or unsecure parameters means via form submisstion , comments , reviews , and all .
let us look into it carefully so basically there are two kind of parameter which the hacker can take advantage of

1) inside get request url

Imagine your website has a search page:

https://example.com/search?q=harsh

Now attacker will inject some script in this url like

Attacker sends victim this URL:

https://example.com/search?q=<script>alert('XSS Attack')</script>

this script could be malicious and can do any thing like attaker can access your cookies or tokens

2) inputs of forms (ex - login form , signup form , comments input , etc.)

Attacker type or inject some sort of malicious javascript code or html code which will be executed by the client browser and boom you are hacked

How many types of XSS are there ?

Reflected XSS attack :

In this type of attack sends a malicious link to the user and when the user clicks on that link a new interface get open in from of it inside that ui it is asked to enter its details like login id and password and boom that data is now gone to the attacker .
How it happens because inside that url some js script is present when that link is put into the browser then browser executes that script which can do anything ,like stealing the tokens , user information ,phishing etc.

It is called reflected because:

Script comes in request and immediately reflects back in response.

Attacker creates malicious link

https://yourwebsite.com/search?q=<script>alert('Hacked')</script>

Victim clicks link

Server responds:

<h2>Results for<script>alert('Hacked')</script></h2>

Browser executes script.

This is generally used in:

1) Phishing emails

2)Whatsapp messages
3)fake login links

Harms it can cause

1. steal cookies
2. steal jwt tokens
3. Fake login form injection
4. redirect ot malicious website
5. perform actions on behalf of user

How to protect our website from reflected Xss ?

1. Input validation (using Zod , joi)
2. Sanitization (Sanitize html)
3. Output Escaping
4. Add security Headers in http request (use helmet)
5. Use CSP Headers (content script policy)
6. store JWT tokens in HTTP only cookies

You can study each of the method in another article this section is just theoretical part .

Now let us move on towards next Xss attack which is stored XSS

Stored Xss Attack :

In this type of attack attacker inject some js script inside the parameters of forms like comment , reviews and all those comments are going to be saved in the database so along with that the script also get saved in database when those comments loads on browser of some users the browser executes that script and boom * you’re hacked again *

now you understood meaning of stored

you can think of it like youtube comments someone comment and injects a script in that comment it get stored in db and when it loads it will execute on every other user’s youtube all are hacked

Harms it can cause:

1. Account takeover
2. steal JWT tokens
3. steal passwords
4. perform actions as victim
5. Attack Admin Panel

How to prevent this attack from happening ?

1. Input validation
2. Input sanitization
3. Output escaping
4. Helmet security headers
5. contenct security policy
6. use HttpOnly cookies

Now let us move towards the last Xss attack

DOM Xss attack

In this type of xss attack what attacker does is it goes to the repo of the website which he wants to attack and then it insert some malicious program or code into their codebase and then send those files to user when user run those file magic happens he got hacked . Although this type of attack easily predictable like no user would run any kind of file coming from any unknown source so it is not that much dangerous .

one more thing why it is called dom xss because it uses dom properties to hack
like:

1. innerHTML
2. outerHTML
3. document.write
4. insertAjacentHTML
5. eval

Harms it can cause

1. Steal JWT token (if token is stored in localstorage)
2. Perform actions as user(transfer money , delete account , change password)
3. Keylogging attack
4. redirect user
5. complete frontend control

How to prevent DOM XSS ?

1. Never use innerHtml (use textcontent)
2. Never use dangerouslySetInnerHTML
3. Sanitize data before inserting
4. Use content security policy
5. Never store JWT in localstorage (use http only cookies)

This was all about the Xss attacks now we will move towards other attacks like

ClickJacking

Clickjacking (also called UI redressing attack) is a technique where an attacker tricks a user into clicking something different from what they think they are clicking.

In this type of attack attacker embeds a webpage of another website into its own website using iframe tag and that page is shown on the screen but it is not visible on the similar page it makes some attractive and greedy buttons which he placed on some other critical button (like pay , delete transaction and all) so when user clicks the greedy button it clicks the underneath button which make transaction or can delete the user account and all that stuff

How Clickjacking Works

Step-by-step:

1. Attacker creates a malicious website.
2. That website loads your real website inside an invisible <iframe>.
3. The attacker places a fake button on top of your real button.
4. When the user clicks the fake button, they are actually clicking your real button underneath.

So the user performs an action on your website without knowing.

Real world example

Imagine:

• Your website: bank.com
• You have a button: "Transfer Money"
• User must click it to confirm transaction.

Attacker:

• Creates free-gifts.com
• Loads bank.com inside an invisible iframe
• Places a fake button: "Click here to win iPhone"
• User clicks it
• Actually clicks "Transfer Money"

💥 Money transferred without user realizing.

Harms it can cause

1. Account setting changes
2. password changes
3. unauthorized access
4. camera and microphone access
5. social media autolikes and autoshares
6. admin action execution

How to prevent ClickJacking

1. Use X-frame-Options header (using helmet)
2. Use Content script policy (CSP)

we will discuss these parts of implementaion in some other article

Now we will move towards a new attack know as packet sniffing

Sniffing

So here basically there are two types of sniffing

1. Packet Sniffing
2. MIME Sniffing

Packet Sniffing Attack

As we know what ever data we are sending from one place to another is travelling through internet and we are not sending the whole data together what we do is we divide it into small small packets these packets travels from source to destination now the doubt is how these packets get reassemble at destination so each packet has some sort of details like each packet has one sequence number which helps all the packets to get reassemble at the destination so in this way our data is trnasferred or received .
Now the how attacks happen so the attacker can read or capture these data packets using some tools like webshark and all these packets can contain critical information like username , password and all which is now know to the hacker and now he can access your account means you are wasted (hacked)

How it happens because your website is using HTTP instead of HTTPS which is sending data as plain text.
for security we use HTTPs which encrypts and decrypts the data at source and destination . due to which attacker is not able to read the data on traverlling on internet.

If you are sending just plain text anyone

connected to the internet can read or see

• Passwords
• JWT tokens
• Session cookies
• API responses
• Credit card data

What Damage Can It Cause?

• Session hijacking
• Credential theft
• Identity theft
• Data leaks
• Financial fraud
• Admin takeover

Especially dangerous if:

• Cookies are not secure
• JWT sent over HTTP
• No TLS encryption

How to Prevent these attacks ?

1. Always use HTTPS ( use SSL/TLS)
2. Use reverse proxy , AWS or GCP , Let’s encrypt certificate
3. Enforce Https in Express
4. Secure Cookies
5. Use HSTs (Http strict Transport Security)

you can study each of the method of prevention seperately or we will discuss them later in some other article

Now let’s move towards MIME sniffing attack

MIME Sniffing Attack

In this type of attack basically when our server sends some response it also send some information header like content-type header which is usually text/plain but the response is not plain -text it could be image , html or even js but content-type is wrong so when this response is received by the browser it analyse the content-type header and the response as the content-type is not matching with the response it tries to detect the correct content-type of the response by analysing first few bites of the response and imagine what happens it interpretes it incorrectly due to which if attacker has injected some malicious code inside that response get executed by the browser quickly

Harms it can lead to

1. XSS Attack
2. CSP bypass

How to prevent this MIME Sniffing ?

1. use X-content-type-options :nosniff header
2. Set Proper content-types
3. Validate Uploads
4. Use Content-Disposition :attachment

I hope this article will help you in understanding the security concepts of a website . we will see its implementation guide in some other article .

Thank you.