Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
-
Economics & Finance
Selected Reading
How to set cookies expiry date in JavaScript?
Setting an expiration date for cookies allows them to persist beyond the current browser session. Without an expiration date, cookies are deleted when the browser closes. You can set the expiry date using the expires attribute in the cookie string.
Syntax
document.cookie = "name=value; expires=date; path=/";
Setting Cookie with 1 Month Expiry
Here's how to create a cookie that expires after one month:
<html>
<head>
<script>
function WriteCookie() {
var now = new Date();
now.setMonth(now.getMonth() + 1);
var cookieName = "username";
var cookieValue = document.getElementById("customer").value;
document.cookie = cookieName + "=" + encodeURIComponent(cookieValue) +
"; expires=" + now.toUTCString() + "; path=/";
document.getElementById("output").innerHTML =
"Cookie set: " + cookieName + "=" + cookieValue +
"<br>Expires: " + now.toUTCString();
}
function ReadCookie() {
var cookies = document.cookie.split(';');
var result = "Current cookies: <br>";
for(var i = 0; i < cookies.length; i++) {
var cookie = cookies[i].trim();
if(cookie) {
result += cookie + "<br>";
}
}
document.getElementById("output").innerHTML = result;
}
</script>
</head>
<body>
<h3>Cookie Expiry Example</h3>
<div>
Enter name: <input type="text" id="customer" value="JohnDoe"/>
<button onclick="WriteCookie()">Set Cookie (1 Month)</button>
<button onclick="ReadCookie()">Read Cookies</button>
</div>
<div id="output" style="margin-top: 20px; padding: 10px; border: 1px solid #ccc;">
Click "Set Cookie" to create a cookie with 1 month expiry
</div>
</body>
</html>
Different Expiry Periods
You can set various expiration periods by modifying the date:
<html>
<head>
<script>
function setCookieWithExpiry(days) {
var date = new Date();
date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
var cookieString = "testCookie=value123; expires=" + date.toUTCString() + "; path=/";
document.cookie = cookieString;
document.getElementById("result").innerHTML =
"Cookie set for " + days + " days<br>" +
"Expires: " + date.toUTCString();
}
</script>
</head>
<body>
<h3>Different Expiry Periods</h3>
<button onclick="setCookieWithExpiry(1)">1 Day</button>
<button onclick="setCookieWithExpiry(7)">1 Week</button>
<button onclick="setCookieWithExpiry(30)">1 Month</button>
<button onclick="setCookieWithExpiry(365)">1 Year</button>
<div id="result" style="margin-top: 20px; padding: 10px; background: #f5f5f5;">
Click any button to set cookie with different expiry periods
</div>
</body>
</html>
Key Points
- Use
setMonth()orsetTime()to calculate future dates - Always use
toUTCString()for proper date formatting - Include
path=/to make cookie accessible across the entire site - Use
encodeURIComponent()to safely encode cookie values - Without expiry date, cookies become session cookies (deleted on browser close)
Expiry vs Max-Age
Modern browsers also support max-age attribute as an alternative to expires:
// Using expires (absolute date) document.cookie = "name=value; expires=" + date.toUTCString(); // Using max-age (seconds from now) document.cookie = "name=value; max-age=2592000"; // 30 days in seconds
Conclusion
Setting cookie expiration dates is essential for persistent data storage. Use expires with proper date calculation to control how long cookies remain active in the user's browser.
Updated on: 2026-03-15T22:22:13+05:30
6K+ Views
Advertisements