जावास्क्रिप्ट कुकीज
- पिछला पृष्ठ JS टाइमिंग
- अगला पृष्ठ वेब एपीआई संक्षिप्त जानकारी
कूकी आपको वेब पृष्ठ में उपयोगकर्ता जानकारी सहेजने की अनुमति देता है।
कूकी क्या है?
कूकी आपके कंप्यूटर पर छोटे पाठ फ़ाइल में सहेजी जाती है।
जब वेब सर्वर ब्राउज़र को पृष्ठ भेजता है, तो कनेक्शन बंद हो जाता है और सर्वर उपयोगकर्ता के सब कुछ भूल जाता है।
कूकी "कैसे उपयोगकर्ता के जानकारी को याद रखें" की समस्या को हल करने के लिए आया है:
- जब उपयोगकर्ता वेब पृष्ठ को देखता है, तो उसका नाम कूकी में सहेजा जा सकता है।
- अगर उपयोगकर्ता फिर से इस पृष्ठ को देखता है, तो कूकी उसके नाम को "याद" रखता है।
कूकी नाम-मान जोड़े में सहेजी जाती है, जैसे:
username = Bill Gates
जब ब्राउज़र सर्वर से एक पृष्ठ की अनुरोध करता है, तो उस पृष्ठ के कूकी उस अनुरोध में जोड़े जाते हैं।इस तरह सर्वर को आवश्यक डाटा मिलता है ताकि वह उपयोगकर्ता के जानकारी को "याद" रख सके।
यदि ब्राउज़र में स्थानीय कूकी समर्थन बंद है, तो इस उदाहरण काम नहीं करेगा。
जावास्क्रिप्ट के द्वारा कूकी बनाना
जावास्क्रिप्ट का इस्तेमाल document.cookie गुण कूकी बनाना, पढ़ना, और हटाना
जावास्क्रिप्ट के द्वारा, इस तरह कूकी बनाया जा सकता है:
document.cookie = "username=Bill Gates";
आप इसके लिए वैध तारीख जोड़ सकते हैं (UTC समय)।मूवबन्धन में, ब्राउज़र बंद होने पर कूकी हटा दी जाती है:
document.cookie = "username=Bill Gates; expires=Sun, 31 Dec 2017 12:00:00 UTC";
द्वारा path पैरामीटर, आप ब्राउज़र को बता सकते हैं कि कुकी कौन-से पथ के लिए है। डिफ़ॉल्ट में, कुकी मौजूदा पृष्ठ के लिए है।
document.cookie = "username=Bill Gates; expires=Sun, 31 Dec 2017 12:00:00 UTC; path=/";
कुकी को JavaScript के द्वारा पढ़ें
कुकी को JavaScript के द्वारा पढ़ें:
var x = document.cookie;
document.cookie सभी कुकी को एक स्ट्रिंग में वापस करता है, जैसे: cookie1=value; cookie2=value; cookie3=value;
कुकी को JavaScript के द्वारा बदलें
जैसे आप कुकी बनाते हैं, आप इसे JavaScript के द्वारा बदल सकते हैं:
document.cookie = "username=Steve Jobs; expires=Sun, 31 Dec 2017 12:00:00 UTC; path=/";
पुराना कुकी ओवरराइड होता है।
कुकी को JavaScript के द्वारा शद्ध करें
कुकी शद्ध करना बहुत सरल है।
कुकी शद्ध करते समय कुकी मूल्य निर्दिष्ट नहीं करना होता:
सीधे expires पूर्वांतर की तारीख सेट करें:
document.cookie = "username=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";
आपको कुकी रूट को परिभाषित करना चाहिए ताकि सही कुकी को शद्ध किया जा सके।
यदि आप रूट नहीं निर्दिष्ट करते, कुछ ब्राउज़र आपको कुकी को शद्ध करने नहीं देंगे।
कुकी चिंनी
document.cookie प्रतियोगिता एक सामान्य टेक्स्ट स्ट्रिंग लगती है। लेकिन यह नहीं है।
भले ही आप document.cookie पूर्ण कुकी चिंनी लिखें, जब फिर से पढ़ते हैं, तो आपको केवल नाम-मूल्य जोड़ावट दिखाई देगा।
यदि नया कुकी सेट किया गया है, तो पुराना कुकी ओवरराइड नहीं होगा। नया कुकी document.cookie में जोड़ा जाएगा, इसलिए अगर आप document.cookie पढ़ते हैं, आपको इस तरह की चीजें मिलेंगी:
cookie1 = value; cookie2 = value;
अगर आप एक निर्दिष्ट cookie का मूल्य खोजना चाहते हैं, तो आपको cookie शब्दचिह्न में cookie मूल्य को खोजने वाली जावास्क्रिप्ट फ़ंक्शन लिखना होगा。
जावास्क्रिप्ट कूकी उदाहरण
नीचे के उदाहरण में, हम एक cookie बनाएंगे जो यात्री के नाम को स्टोर करे।
यात्री पहली बार वेबपेज पर पहुंचता है, तो उसे उसका नाम भरने के लिए कहा जाएगा। फिर इस नाम को cookie में स्टोर किया जाएगा。
अगर अगला यात्री एक ही पृष्ठ पर पहुंचता है, तो उसे एक स्वागत संदेश मिलेगा。
उदाहरण में, हम 3 जावास्क्रिप्ट फ़ंक्शन बनाएंगे:
- cookie मूल्य सेट करने का फ़ंक्शन
- cookie मूल्य की फ़ंक्शन
- cookie मूल्य की जांच करने का फ़ंक्शन
cookie सेट करने का फ़ंक्शन
पहले, हम एक फ़ंक्शन बनाएं जो यात्री के नाम को cookie वेरियेबल में स्टोर करे:
उदाहरण
function setCookie(cname, cvalue, exdays) {
var d = new Date();
d.setTime(d.getTime() + (exdays*24*60*60*1000));
var expires = "expires="+ d.toUTCString();
document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
}
उदाहरण का स्पष्टीकरण:
इस फ़ंक्शन के पैरामीटर हैं: cookie का नाम (cname), cookie का मूल्य (cvalue) और cookie के अवधि के दिन (exdays)।
cookie नाम, cookie मूल्य और अवधि के शब्द से कोडिंग करके, फ़ंक्शन ने cookie को सेट किया।
cookie की फ़ंक्शन
तब, हम एक फ़ंक्शन बनाएं जो निर्दिष्ट cookie के मूल्य को वापस करे:
उदाहरण
function getCookie(cname) {
var name = cname + "=";
var decodedCookie = decodeURIComponent(document.cookie);
var ca = decodedCookie.split(';');
for(var i = 0; i <ca.length; i++) {
var c = ca[i];
while (c.charAt(0) == ' ') {
c = c.substring(1);
}
if (c.indexOf(name) == 0) {
return c.substring(name.length, c.length);
}
}
return "";
}
फ़ंक्शन का स्पष्टीकरण:
cookie को पैरामीटर (cname) के रूप में दें。
वेरियेबल (name) और चोखा करने वाले टेक्स्ट (CNAME”=”) का निर्माण करें。
cookie कोडिंग करें, विशेष अक्षरों सहित cookie का संस्करण करें, जैसे कि “$”.
document.cookie को सबसे आगे के सीधे अडचन से विभाजित करके नाम ca (decodedCookie.split(';')) के एक्सेस करें।
ca एक्सेस के लिए बढ़ते हुए अनुक्रम (i = 0; i < ca.length; i++), फिर प्रत्येक मान को पढ़ें c = ca[i]。
अगर कुकी मिला (c.indexOf(name) == 0), तो उस कुकी का मूल्य (c.substring(name.length, c.length)) वापस करेगा。
अगर कुकी नहीं मिला, तो "" वापस करेगा。
कुकी का निरीक्षण करने वाला फ़ंक्शन
अंत में, हम कुकी को सेट करने के लिए फ़ंक्शन बनाते हैं。
अगर कुकी पहले से सेट है, तो एक स्वागत दिखाया जाएगा。
अगर कुकी नहीं सेट है, तो एक अड्डा दिखाया जाएगा, जिसमें उपयोगकर्ता का नाम पूछा जाएगा और उपयोगकर्ता का कुकी 365 दिन के लिए सहेजा जाएगा, setCookie को कॉल करके setCookie तत्व:
उदाहरण
function checkCookie() {
var username = getCookie("username");
if (username != "") {
alert("Welcome again " + username);
}
username = prompt("Please enter your name:", "");
if (username != "" && username != null) {
setCookie("username", username, 365);
}
}
}
अब इसे जोड़ दें
उदाहरण
function setCookie(cname, cvalue, exdays) {
var d = new Date();
d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000));
var expires = "expires="+d.toUTCString();
document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
}
function getCookie(cname) {
var name = cname + "=";
var ca = document.cookie.split(';');
for(var i = 0; i < ca.length; i++) {
var c = ca[i];
while (c.charAt(0) == ' ') {
c = c.substring(1);
}
if (c.indexOf(name) == 0) {
return c.substring(name.length, c.length);
}
}
return "";
}
function checkCookie() {
var user = getCookie("username");
if (user != "") {
alert("Welcome again " + user);
}
user = prompt("Please enter your name:", "");
if (user != "" && user != null) {
setCookie("username", user, 365);
}
}
}
ऊपरी उदाहरण एचटीएमएल पृष्ठ लोड होने के बाद checkCookie() फ़ंक्शन चलेगा।
- पिछला पृष्ठ JS टाइमिंग
- अगला पृष्ठ वेब एपीआई संक्षिप्त जानकारी
