Posts

Showing posts with the label web security

CSRF Anti-Attack Guide

Image
Introduction CSRF (Cross-Site Request Forgery) is a type of attack targeting user sessions. Attackers trick the victim's browser into sending requests (accompanied by identification cookies) to websites where they are logged in without permission. To prevent CSRF, we have 3 main strategies: Method 1 : Check Origin / Referer headers Check if the Origin or Referer header matches the server domain. If they differ, block them immediately at the NextJS Proxy layer before forwarding to the server. Method 2 : Configure SameSite for Cookies When setting cookies for the client, you must set the SameSite=Strict or SameSite=Lax attribute. In this case, if the request originates from a different website, the browser will refuse to attach the Cookie, NextJS receives an empty request and will return a 401 Unauthorized error. Method 3 : Use CSRF Token Require the client to send a Token (generated randomly for each user or using JWT) in the Header. Since a fake site cannot have this token, the out...

Security Auditing for Project Packages

Image
Introduction In previous articles, I have guided you through various ways to enhance project security through direct implementation. Now, I will demonstrate how to perform security audits for the packages you use. This is also a critical factor because while your codebase may be secure, a library you are using could contain hidden security risks that hackers can exploit. Detail First, let us look at how to check a package for security risks. Before installing, you can visit certain websites to verify package information, such as using https://security.snyk.io . This website provides comprehensive information to assess the health of a package and supports multiple languages. NPM Next is auditing security for the packages your project is currently using. Because technology changes rapidly, a package you use today might be fine, but it could reveal security risks a few months later. Therefore, this check needs to be performed regularly depending on the scale of the product you are develop...

XSS Security Handling with NextJS and DOMPurify

Image
Introduction Cross-Site Scripting (XSS) is a security vulnerability that allows attackers to inject malicious scripts, typically JavaScript, into web pages viewed by other users. When a user's browser executes this code, attackers can steal cookies, session tokens and alter the website interface. To prevent XSS, the following primary methods are used: Validation: Accepting only desired data formats. This simple approach only addresses surface-level issues, so we focus on the methods below for better effectiveness. Sanitization: Removing or disabling dangerous HTML tags and attributes such as <script> , onerror and onclick from user input before storage or display. Using Framework Automations: React and NextJS automatically escape data in text strings by default. When rendering HTML directly via dangerouslySetInnerHTML , using a library like DOMPurify is mandatory to ensure safety. Content Security Policy (CSP): Configuring browser policies to restrict script execution s...