How to set cookie secure flag using javascript

Setting the security flags for cookies in JavaScript typically involves configuring the Secure and HttpOnly attributes to enhance cookie security. Below are methods to implement these flags:

Setting the Secure Flag

The Secure flag ensures cookies are transmitted exclusively over HTTPS, not HTTP. This prevents cookies from being intercepted over insecure networks. When setting cookies, add the Secure flag as follows:

javascript
document.cookie = "username=JohnDoe; Secure";

Setting the HttpOnly Flag

The HttpOnly flag prevents JavaScript from accessing cookies, reducing the risk of Cross-Site Scripting (XSS) attacks. This flag must be set via HTTP headers on the server side. Assuming you have server-side capabilities to set cookies, use the following HTTP header:

shell
Set-Cookie: sessionId=38afes7a8; HttpOnly

If you can write server-side code (e.g., Node.js), set a cookie with the HttpOnly flag like this:

javascript
response.setHeader('Set-Cookie', 'sessionId=38afes7a8; HttpOnly');

Setting Both Secure and HttpOnly Flags

Configure both flags to strengthen cookie security. Here's an example:

javascript
document.cookie = "username=JohnDoe; Secure; HttpOnly";

On the server side, for instance with Express.js:

javascript
res.cookie('username', 'JohnDoe', { secure: true, httpOnly: true });

Setting Other Security-Related Cookie Options

Beyond Secure and HttpOnly, consider these additional security measures:

• The SameSite attribute restricts third-party cookies, mitigating Cross-Site Request Forgery (CSRF) risks. It accepts three values: Strict, Lax, and None.
• max-age and expires define cookie expiration, reducing vulnerabilities from stale cookies.

For example, here's a cookie with multiple security options:

javascript
document.cookie = "username=JohnDoe; Secure; HttpOnly; SameSite=Strict; max-age=3600";

Summary

Implementing the Secure and HttpOnly flags when setting cookies is a critical security best practice. Additionally, leverage the SameSite attribute and appropriate expiration times to further enhance security. Note that the HttpOnly flag is typically set on the server side, while Secure, SameSite, and expiration settings can be configured via client-side scripts.