Posts

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

Preventing XSS in NextJS with CSP and Nonce

Image
Introduction Content Security Policy (CSP) is an additional security layer that helps detect and mitigate certain types of attacks, including Cross-Site Scripting (XSS) and data injection attacks. By defining the content sources (scripts, styles and images) allowed to execute, CSP prevents the browser from loading malicious resources from unknown sources, thereby protecting user data proactively. Nonce (Number used once) is a random string generated for each request and attached to the script tag. When CSP is configured with this nonce value, the browser only executes script blocks with a nonce attribute matching the value in the CSP header. The greatest advantage of Nonce is allowing the safe execution of inline scripts without opening the browser to all malicious scripts, balancing convenience and high security. When using Nonce, a random value must be generated and attached to the header to distinguish between our website's scripts and hacker scripts, which introduces a major dr...