Web security

Local Storage

• LocalStorage is super convenient to use because it always uses JavaScript to access a token. Its contents cannot be automatically sent anywhere. Therefore, localStorage is immune to cross-site request forgery (CSRF) attacks.
• On the downside, localStorage is potentially vulnerable to cross-site scripting (XSS) attacks. If an attacker can inject malicious JavaScript into a webpage, they can steal an access token in localStorage. Also, unlike cookies, localStorage doesn’t provide secure attributes that you can set to block attacks.

Cookies

• An HTTP cookie (web cookie, browser cookie) is a small piece of data that a server sends to a user's web browser.

• Cookies are not accessible via JavaScript provided the proper secure attributes for the cookies are set. This makes cookie data less vulnerable than localStorage data to JavaScript-based attacks.

• Cookies have a limited storage capacity of 4KB, you might not be able to store some tokens that way. You may also need to put an access token in the HTTP Authorization request header with some APIs, which means cookies won’t work to store the tokens in all cases.

• They are used for 3 main purposes

• Session management Logins, shopping carts, game scores, or anything else the server should remember

• Personalization User preferences, themes, and other settings

• Tracking Recording and analyzing user behavior

HttpOnly

• HttpOnly is an additional flag included in a Set-Cookie HTTP response header. If the HttpOnly flag is included in the HTTP response header, the cookie cannot be accessed through the client-side script (if the browser supports it).
• It is not accessible with document.cookie with JS and you can just send it to the server. (if the browser supports it).
• As a result, even if a cross-site scripting (XSS) flaw exists, and a user accidentally accesses a link that exploits this flaw, the browser will not reveal the cookie to a third party.

Cross-Site Scripting

• XSS attacks are a type of injection, in which malicious scripts are injected into otherwise benign and trusted websites. XSS attacks occur when an attacker uses a web application to send malicious code, generally in the form of a browser side script, to a different end user.

CORS

𝗖𝗢𝗥𝗦 𝘀𝘁𝗮𝗻𝗱𝘀 𝗳𝗼𝗿 𝗖𝗿𝗼𝘀𝘀-𝗢𝗿𝗶𝗴𝗶𝗻 𝗥𝗲𝘀𝗼𝘂𝗿𝗰𝗲 𝗦𝗵𝗮𝗿𝗶𝗻𝗴

𝘐𝘵'𝘴 𝘢 𝘸𝘢𝘺 𝘧𝘰𝘳 𝘣𝘳𝘰𝘸𝘴𝘦𝘳𝘴 𝘵𝘰 𝘥𝘦𝘵𝘦𝘳𝘮𝘪𝘯𝘦 𝘸𝘩𝘦𝘵𝘩𝘦𝘳 𝘰𝘳 𝘯𝘰𝘵 𝘵𝘩𝘦𝘺 𝘴𝘩𝘰𝘶𝘭𝘥 𝘢𝘭𝘭𝘰𝘸 𝘳𝘦𝘲𝘶𝘦𝘴𝘵𝘴 𝘧𝘳𝘰𝘮 𝘰𝘯𝘦 𝘥𝘰𝘮𝘢𝘪𝘯 𝘵𝘰 𝘢𝘤𝘤𝘦𝘴𝘴 𝘳𝘦𝘴𝘰𝘶𝘳𝘤𝘦𝘴 𝘧𝘳𝘰𝘮 𝘢𝘯𝘰𝘵𝘩𝘦𝘳 𝘥𝘰𝘮𝘢𝘪𝘯. 𝘐𝘵'𝘴 𝘶𝘴𝘦𝘥 𝘸𝘩𝘦𝘯 𝘺𝘰𝘶 𝘸𝘢𝘯𝘵 𝘵𝘰 𝘦𝘮𝘣𝘦𝘥 𝘤𝘰𝘯𝘵𝘦𝘯𝘵 𝘧𝘳𝘰𝘮 𝘰𝘯𝘦 𝘴𝘪𝘵𝘦 𝘪𝘯𝘵𝘰 𝘢𝘯𝘰𝘵𝘩𝘦𝘳 𝘴𝘪𝘵𝘦.

𝗧𝗵𝗲𝗿𝗲 𝗮𝗿𝗲 𝘁𝘄𝗼 𝘁𝘆𝗽𝗲𝘀 𝗼𝗳 𝗖𝗢𝗥𝗦 𝗵𝗲𝗮𝗱𝗲𝗿𝘀: ① Access-Control-Allow-Origin ② Access-Control-Allow-Methods

👀 𝗧𝗵𝗲 𝗳𝗶𝗿𝘀𝘁 𝗵𝗲𝗮𝗱𝗲𝗿 tells the browser which domains are allowed to access the requested resource.

👀 𝗧𝗵𝗲 𝘀𝗲𝗰𝗼𝗻𝗱 𝗵𝗲𝗮𝗱𝗲𝗿 tell the browser which methods (e.g., GET, POST ) are allowed.

CSRF

CSRF stands for Cross-Site Request Forgery is a web security vulnerability that allows an attacker to induce users to perform actions that they do not intend to perform. An attack that forces an end user to execute unwanted actions on a web application in which they’re currently authenticated. A site is making requests to your site pretending to be another user.

JSON Web Token

• (JWT) is an open standard (RFC 7519) that defines a compact and self-contained way for securely transmitting information between parties as a JSON object.
• This information can be verified and trusted because it is signed digitally.
• JWT tokens can be signed with a secret.

How to Secure Cookies From Hackers

• Secure attribute In production, the Secure attribute will ensure that the cookies are only sent over the encrypted connection. If a website doesn't use an SSL certificate and https protocol, the server will not send the cookies.

• HttpOnly Attribute With this attribute, you forbid JavaScript code from accessing cookies. It protects the cookies from cross-site scripting attacks (XSS).

• SameSite Attribute It controls when to send cookies with the cross-site requests. This attribute provides some protection against cross-site request forgery attacks (CSRF).

• There are 3 values this attribute accepts:

  • Strict: When you use SameSite=Strict attribute with the cookie, the browser will send that cookie only for the same-site requests. If a different domain sends the request, no cookie with the SameSite=Strict attribute will be sent.
  • Lax - a cookie is only set when the domain in the URL of the browser matches the domain of the cookie, thus eliminating third party’s domains.
  • None - The browser sends cookies for both cross-site and same-site requests. If you use SameSite=None for your cookie, you have to specify the Secure attribute along with it.