jQuery आणि PHP वापरून कुकीज सेट करणे आणि वाचणे. jQuery मधील कुकीज वापरणे

कुकीज तुम्हाला तुमच्या वेबसाइटवर उत्कृष्ट अनुभव देण्यासाठी वापरकर्त्याबद्दल उपयुक्त माहिती साठवण्याची परवानगी देतात. तुम्ही त्यांच्यासोबत jQuery मध्ये देखील काम करू शकता. या ट्यूटोरियलमध्ये आम्ही काही वापरकर्ता प्राधान्ये संग्रहित करण्यासाठी jQuery आणि कुकीज कशा वापरू शकतो ते पाहू जेणेकरून विशिष्ट सामग्री प्रदर्शित करताना आम्ही त्यांचा वापर करू शकू.

चला सुरू करुया

आम्ही एकापेक्षा जास्त लेबल असलेले पॅनेल बनवणार आहोत. प्रत्येक वेळी तुम्ही लेबलवर क्लिक करता तेव्हा ते रंगात हायलाइट केले जाते आणि लेबलशी संबंधित मूल्य तुमच्या ब्राउझरचा वापर करून तुमच्या संगणकावरील कुकीमध्ये सेव्ह केले जाते. त्यानंतर तुम्ही कुकीमध्ये साठवलेले वर्तमान मूल्य प्रदर्शित करण्यासाठी किंवा कुकी हटविण्यासाठी दोन बटणे वापरू शकता.

तसेच, प्रथम डाउनलोड दरम्यान डेमो पृष्ठाकडे लक्ष द्या. कोणतेही लेबल हायलाइट केलेले नाहीत. आणि तुम्ही एक निवडल्यानंतर, तुम्ही डेमो पेज रिफ्रेश करू शकता आणि तुम्ही निवडलेले लेबल निवडलेले राहील. तुम्ही तुमच्या कुकीज साफ केल्यास, लेबलमधून हायलाइट काढला जाईल. आणि रीबूट केल्यानंतर, सर्व लेबले न निवडलेली राहतील. आता हे कसे कार्य करते ते पाहू.

jQuery सह कुकीज व्यवस्थापित करणे

आम्ही कुकीज व्यवस्थापित करण्यासाठी jQuery वापरणार आहोत, ज्यामध्ये कुकी स्टोरेजसह कार्य करण्यासाठी डिझाइन केलेले प्लगइन समाविष्ट असेल. प्लगइनचे नाव स्वतःसाठी बोलते - कुकी.

कुकी प्लगइन jQuery प्लगइन साइटच्या प्रकल्प विभागातून डाउनलोड केले जाऊ शकते.

कुकी हे फक्त एक कुकी() फंक्शन असलेले एक साधे प्लगइन आहे. या फंक्शनचा वापर करून, क्लायंटच्या संगणकावर कुकी मूल्ये जतन, पुनर्प्राप्त आणि हटविली जातात.

चिन्हांकित करणे

jQuery लायब्ररी कनेक्ट केल्यानंतर, आम्ही प्लगइन कनेक्ट करतो jquery.cookie.jsआमच्या HTML कोडमध्ये. मग आम्ही JavaScript फाइल समाविष्ट करतो, ज्यामध्ये कुकीजसह कार्य करण्यासाठी कोड असतो (आपण वापरून HTML कोडमध्ये स्क्रिप्ट मजकूर देखील समाविष्ट करू शकता.

HTML कोड अगदी सोपा दिसतो:

• बेसिक
• मानक
• विस्तारित

कुकीज दाखवा कुकीज हटवा

आम्ही कुकी स्थिती प्रदर्शित करण्यासाठी तीन लेबले, दोन लिंक्स आणि फील्ड तयार करतो. CSS फाईलमधील मजकूर धड्याच्या विषयाशी संबंधित नाही आणि फक्त .selected वर्ग वापरून निवडलेले लेबल हायलाइट करण्यासाठी वापरले जाते. चला तर सरळ JavaScript कोड वर जाऊ.

आम्ही कुकीज तयार करतो

त्यामुळे दस्तऐवज तयार झाल्यावर आमची स्क्रिप्ट कार्यान्वित करण्यासाठी आम्हाला नेहमीचा कोड जोडणे आवश्यक आहे:

JQuery(दस्तऐवज).रेडी(फंक्शन())(//स्क्रिप्ट कोड येथे ठेवला आहे));

आता काही व्हेरिएबल्स सुरू करूया जे नंतर आमच्या कोडमध्ये वापरले जातील. हे कुकीचे नाव आहे आणि कुकी फंक्शनचे पर्याय: कुकीचे जीवनकाळ आणि पृष्ठ पत्त्यावर जोडलेला मार्ग. इतर युक्तिवाद देखील शक्य आहेत, परंतु आमच्या धड्यात आम्ही फक्त हे दोन वापरू:

Var cookieName = "स्तर"; var cookieOptions = (कालबाह्य: 7, पथ: "/");

पुढे आम्हाला आमच्या कुकीमध्ये मूल्य तपासण्याची आवश्यकता आहे. जर ते नसेल तर पुढे जा. परंतु कुकीमध्ये मूल्य असल्यास, कुकीमध्ये आयडी सेव्ह केलेल्या लेबलसाठी तुम्हाला .सिलेक्टेड क्लास सेट करणे आवश्यक आहे. आम्ही एका पॅरामीटरसह कुकी फंक्शन वापरतो, जे कुकीचे नाव आहे ज्याचे मूल्य आम्हाला मिळणे आवश्यक आहे:

$("#" + $.cookie(cookieName)).addClass("निवडलेले");

आता आपण माउस क्लिक इव्हेंट हँडलर तयार करतो. प्रीव्हेंटडीफॉल्ट() फंक्शन ही एक मानक jQuery प्रक्रिया आहे जी ब्राउझरला लिंक फॉलो करण्यापासून प्रतिबंधित करते जेव्हा त्यावर माउस बटण क्लिक केले जाते. जेव्हा वापरकर्ता लेबलवर क्लिक करतो (जो प्रत्यक्षात एक दुवा आहे), आम्ही वर्ग काढून टाकतो .निवडलेसध्या निवडलेल्या लेबलमधून आणि नुकत्याच निवडलेल्यावर सेट करा.

$(".htabs a").क्लिक(function(e)(e.preventDefault(); $("#" + $.cookie(cookieName)).removeClass("selected");

कुकी तयार करण्याची आणि त्यावर मूल्य नियुक्त करण्याची वेळ आली आहे. पहिला युक्तिवाद कुकीचे नाव आहे, आमच्या उदाहरण स्तरामध्ये , आणि दुसरा युक्तिवाद कुकीला नियुक्त केले जाणारे मूल्य आहे. आम्ही फंक्शनला पर्याय देखील देतो.

आता लेबलमध्ये .selected वर्ग जोडूया:

$("#" + $.cookie(cookieName)).addClass("निवडलेले");));

कुकी मूल्य मिळवणे आणि प्रदर्शित करणे

आता आपल्याला कुकी मूल्य प्रदर्शित करणे आवश्यक आहे. आपल्याला फक्त एका पॅरामीटरसह कुकी फंक्शन कॉल करणे आवश्यक आहे, जे कुकीचे नाव आहे ज्याचे मूल्य आपल्याला आवश्यक आहे. जेव्हा #showCookie बटण क्लिक केले जाते, तेव्हा आम्ही फील्डमध्ये वर्तमान कुकी मूल्य रेकॉर्ड करतो #व्हर्बोज.

$("#showCookie").क्लिक(function(e)( e.preventDefault(); $("#verbose").val("कुकी मूल्य हे " + $.cookie(cookieName) + ".");) );

कुकीज हटवत आहे

आता आपल्याला कुकीज कशा हटवायच्या हे शोधण्याची आवश्यकता आहे. म्हणून, जेव्हा वापरकर्ता #deleteCookie बटणावर क्लिक करतो, तेव्हा आम्ही फील्डमध्ये आउटपुट करतो #व्हर्बोजकुकी हटवली गेली आहे हे दर्शवणारा संदेश. त्यानंतर आम्ही सध्या निवडलेल्या लेबलमधून .selected वर्ग काढून टाकतो.

$("#deleteCookie").क्लिक(function(e)( e.preventDefault(); $("#verbose").val("कुकी "लेव्हल" मूल्यासह \"" + $.cookie(cookieName) + " \" काढले." $("#" + $.cookie(cookieName)).removeClass("selected");

शेवटी, आम्ही कुकीज हटवतो. हा एक अतिशय मनोरंजक मुद्दा आहे. कोड असे दिसते:

$.cookie(cookieName, null, (path:"/"));

इतकंच. फंक्शनचा तिसरा आर्ग्युमेंट पाहू. आपण प्लगइन कोड पाहिल्यास jquery.cookie.js, नंतर असे दिसून येते की दुसऱ्या युक्तिवादाच्या मूल्यासह निरर्थकऑप्शन्स ॲरेमधील एक्सपायर्स व्हेरिएबलला मूल्य -1 नियुक्त केले आहे:

जर (मूल्य === शून्य) (मूल्य = ""; options.expires = -1;)

तर आम्ही पास झालो तर कुकी पर्यायतिसरा युक्तिवाद म्हणून, उदाहरणार्थ, यासारखे:

$.cookie(cookieName, $(this).attr("id"), cookieOptions);

नंतर आमच्या कोडचे ऑपरेशन विस्कळीत होईल, पासून cookieOptions.expiresमूल्य -1 घेईल, जे प्लगइनच्या तर्काशी पूर्णपणे जुळते.

आणि जर नकारात्मक मूल्य निर्दिष्ट केले असेल (म्हणजे भूतकाळातील तारीख), कुकी हटविली जाईल.

परंतु पथ निर्दिष्ट करणे आवश्यक आहे, कारण काही प्रकरणांमध्ये प्लगइनने पथ निर्दिष्ट केल्याशिवाय कुकीज हटवल्या नाहीत.

वेब ब्राउझर साइटवरील प्रत्येक वापरकर्त्यासाठी विशिष्ट विशिष्ट सत्रे व्युत्पन्न करू शकतात. बहुतेकदा ही प्रक्रिया PHP किंवा रुबी सारख्या भाषा वापरून मागील बाजूस लागू केली जाते, परंतु आम्ही जावास्क्रिप्ट वापरून पुढील बाजूस सत्र कुकीज देखील वापरू शकतो. तेथे अनेक ट्यूटोरियल आहेत जे तुम्हाला शुद्ध JS कुकीज कसे तयार करायचे ते सांगतात. परंतु नवीन jQuery कुकीज लायब्ररी ही प्रक्रिया अधिक सुलभ करते.

एक अतिशय सोपी प्रमाणीकरण प्रणाली कार्यान्वित करण्यासाठी तुम्ही ते कसे वापरू शकता ते आम्ही तुम्हाला सांगतो. सर्व कोड समोरच्या बाजूला सादर केले जातील, परंतु कामाचे परिणाम पाहण्यासाठी, तुम्हाला चाचणीसाठी थेट सर्व्हरची आवश्यकता असेल. वेब सर्व्हरद्वारे ऑफर केलेल्या स्थानिक IP वर ब्राउझर कुकीज तयार केल्या जातील, याचा अर्थ असा की दुर्दैवाने तुम्ही या स्क्रिप्ट स्थानिक पातळीवर चालवू शकणार नाही. आम्ही कशाबद्दल बोलत आहोत हे पाहण्यासाठी थेट डेमो पहायला विसरू नका.

लक्ष द्या! तुम्हाला लपवलेला मजकूर पाहण्याची परवानगी नाही.

दस्तऐवज आधार

सुरुवात करण्यासाठी, आम्ही jQuery लायब्ररी, तसेच jQuery कुकीज फंक्शनचा एकल संदर्भासह नमुना HTML5 दस्तऐवज तयार करू. तुम्ही ते थेट डाउनलोड करू शकता आणि आम्हाला फक्त jquery.cookie.js फाइलची आवश्यकता असेल.

jQuery सह कुकीज व्यवस्थापित करणे - लाइव्ह डेमो







ट्यूटोरियल पृष्ठासाठी दोन भिन्न दृश्ये तयार करण्यावर लक्ष केंद्रित करेल. प्रथम आमच्याकडे एक लॉगिन फॉर्म असेल जो कुकी नसल्यास प्रदर्शित केला जाईल. मानक डेमो/डेमो मूल्ये वापरून, तुम्ही फॉर्म वापरून लॉग इन करू शकता आणि ते तुमचे सत्र कुकीमध्ये सेव्ह करेल.

साहजिकच, तुम्ही स्क्रिप्टला डेटाबेसशी जोडल्यास, तुम्ही मोठ्या संख्येने लॉगिन देऊ शकाल. याचा अर्थ असा की एका स्क्रिप्टद्वारे तुम्ही अनेक लोकांना अधिकृत करू शकता आणि त्याच वेळी त्यांचे लॉगिन किंवा आयडी स्थानिक कुकीजमध्ये संग्रहित करू शकता. हे उदाहरण फक्त एक प्रारंभिक बिंदू आहे जिथे आम्हाला वापरकर्त्यांना अधिकृत करण्यासाठी Ajax विनंत्या किंवा सर्व्हर साइड स्क्रिप्टची आवश्यकता नाही.

आतील घटक सामग्री

पहिला div हा रॅपर आहे ज्यामध्ये संपूर्ण पृष्ठ असते. आयडी #loginform सह एक फॉर्म आहे जो प्रथम प्रदर्शित केला जातो. जर अभ्यागत सध्या सत्र कुकी वापरून डेमो खात्यात लॉग इन केले असेल तरच ते jQuery द्वारे लपवले जाईल.

मूलभूत कुकी व्यवस्थापन

खालील वापरकर्तानाव/पासवर्डसह डेमो खात्यात लॉग इन करा: डेमो/डेमो

वापरकर्तानाव:

पासवर्ड:

तुम्ही डेमो म्हणून लॉग इन आहात! कुकी मूळ लॉगिनपासून 1 दिवसात कालबाह्य होण्यासाठी सेट केली आहे.

लॉगआउट करू इच्छिता? सोपे!

आता लॉगआउट करा

तुमच्या लक्षात आले असेल की लॉगिन फॉर्म नंतर HTML मध्ये #logindetails या आयडीसह आणखी एक div आहे. आम्ही ते CSS शैली वापरून लपवले आहे, कारण वापरकर्त्याने लॉग इन केले असेल तरच त्याला ते प्रदर्शित करणे आवश्यक आहे. अंतर्गत HTML स्थिर आहे आणि नेहमी डेमो वापरकर्तानाव प्रदर्शित करते. परंतु डेटाबेससह कार्य करताना, आपण जावास्क्रिप्ट वापरून कोणत्याही वापरकर्तानावावर हे पॅरामीटर अद्यतनित करू शकता.

CSS शैली इतक्या क्लिष्ट नाहीत, परंतु काही तपशीलांमध्ये जाणे चांगले होईल. आम्ही ट्यूटोरियलमधील टिप्स वापरून एक तकतकीत CSS3 बटण तयार केले. या शैली खूप विस्तृत आहेत आणि इतर प्रकल्पांमध्ये पुन्हा वापरण्यासाठी जतन केल्या पाहिजेत.

/** फॉर्म घटक **/
फॉर्म लेबल (फॉन्ट-आकार: 1.1em; ओळ-उंची: 1.25em; फॉन्ट-वजन: ठळक; समास-तळा: 5px; )

फॉर्म input.basic (
प्रदर्शन: ब्लॉक;
बाह्यरेखा: काहीही नाही;
फॉन्ट-आकार: 1.5em;
रंग: #525252;
रुंदी: 300px;
पॅडिंग: 10px 8px 10px 8px;
समास-तळाशी: 7px;
सीमा: 1px घन #888;
सीमा-त्रिज्या: 5px;
-वेबकिट-बॉक्स-शॅडो: इनसेट 0 1px 2px rgba(0,0,0,0.4);
-moz-बॉक्स-शॅडो: इनसेट 0 1px 2px rgba(0,0,0,0.4);
बॉक्स-छाया: इनसेट 0 1px 2px rgba(0,0,0,0.4);
}

#logindetails (
प्रदर्शन: काहीही नाही;
}
पृष्ठामध्ये अधिक चांगल्या प्रकारे बसण्यासाठी आम्ही मानक इनपुट घटक देखील बदलले आहेत. लॉगिन तपशील कंटेनर डिस्प्लेसह चिन्हांकित केले आहे: कोणतीही मालमत्ता नाही, त्यामुळे ते व्युत्पन्न पृष्ठावर कोणतीही जागा घेणार नाही. तथापि, तो अजूनही DOM चा सक्रिय भाग बनवतो, याचा अर्थ आम्ही jQuery वापरून प्रदर्शन मूल्य हाताळू शकतो. आता क्लोजिंग बॉडी टॅगच्या अगदी आधी पेजच्या तळाशी असलेल्या या jQuery कोडवर एक नजर टाकू.

jQuery मध्ये कुकीज

प्लगइन आम्हाला अनेक मानक फंक्शन्स ऑफर करते ज्यांना नियमित जावास्क्रिप्टमध्ये अधिक तर्काची आवश्यकता असू शकते. हे नवीन कुकीज कॉल करण्यासाठी आणि विद्यमान हटविण्यासाठी पूर्व-निर्मित अंतर्गत पद्धती प्रदान करते. येथे काय चालले आहे हे समजून घेण्यासाठी कोडच्या ओपनिंग ब्लॉकवर एक नजर टाकूया:

$(कार्य())(
if($.cookie("वापरकर्तानाव")) (
$("#लॉगिनफॉर्म").लपवा();
$("#logindetails").शो();
}
बॅकएंड भाषांचा वापर करून हा फॉर्म नियंत्रित करण्याचे निःसंशयपणे चांगले मार्ग आहेत, परंतु आमच्या डेमोमध्ये, jQuery चांगले काम करते. $.cookie('username') विरुद्ध if स्टेटमेंट चालवून, आम्ही "वापरकर्तानाव" कुकी अस्तित्वात आहे का ते तपासतो. जर होय, तर आम्हाला माहित आहे की वापरकर्त्याने सध्या त्यांच्या खात्यात लॉग इन केले आहे, म्हणून आम्ही अधिकृतता फॉर्म लपवतो आणि लॉगिन माहिती दाखवतो. अन्यथा, काहीही होत नाही आणि आम्हाला फक्त लॉगिन फॉर्म असलेले एक पृष्ठ दिसते.

$("#लॉगिनफॉर्म").सबमिट(फंक्शन(ई)(
e.preventDefault();
var इनपुटनाम = $("#username").val();
var इनपुटपास = $("#पासवर्ड").val();

जर (इनपुटुनेम == "डेमो" && इनपुटपास == "डेमो") (
// यशस्वी प्रमाणीकरण आणि कुकी तयार करा
$.cookie("वापरकर्तानाव", "डेमो", ( कालबाह्य: 1 ));
var currentusr = $.cookie("वापरकर्तानाव");
window.location.reload();
}
});

$("#logoutbtn").on("क्लिक", फंक्शन(e)(
e.preventDefault();
if($.removeCookie("वापरकर्तानाव")) (
$("#logoutcontainer").html("यशस्वीपणे लॉग आउट झाले! आत्ता पेज रिफ्रेश करत आहे...");
window.setTimeout("location.reload()", 2000); // 2 सेकंदांनंतर रिफ्रेश करा
}
});
});
आम्ही ही दोन फंक्शन्स कोडच्या एकाच ब्लॉकमध्ये एकत्र केली कारण ते खूप समान आहेत. वापरकर्त्याने खात्यात लॉग इन करण्याचा प्रयत्न करताच, आम्ही वापरकर्तानाव/संकेतशब्द "डेमो" शी जुळतो का ते तपासतो. जर होय, तर आम्ही $.cookie('username', 'demo', ( expires: 1 )); चालवतो, ज्यामध्ये अनेक पर्याय आहेत.

प्रथम आम्ही एक कुकी नाव "वापरकर्तानाव" नियुक्त करतो, ज्याच्या विरूद्ध आम्ही मूल्य तपासू शकतो. स्ट्रिंग "डेमो" हे कुकी मूल्य आहे, परंतु हे लक्षात ठेवणे महत्त्वाचे आहे की ही पद्धत अन्यथा अधिक योग्य असेल तर आम्ही कोणतेही वापरकर्तानाव किंवा आयडी देखील प्रविष्ट करू शकतो. शेवटी, शेवटचा पॅरामीटर हा पर्यायांचा संग्रह आहे जो कुकी कालबाह्य होण्यापूर्वी दिवसांची संख्या सेट करतो. आम्ही कालबाह्यता पर्याय वगळल्यास, वापरकर्त्याने ब्राउझर बंद करताच कुकीज हटवल्या जातील. हे सत्र कुकीमध्ये देखील नमूद केले आहे आणि खाली आम्ही स्क्रिप्टच्या तळाशी टिप्पणी केलेले एक साधे उदाहरण दिले आहे.

कोडचा दुसरा ब्लॉक #logoutbtn लिंकवर वापरकर्त्याच्या क्लिकचा मागोवा घेतो. अर्थात, जर वापरकर्ता सध्या लॉग इन असेल तरच लॉगआउट लिंक प्रदर्शित होईल. हे फंक्शन if स्टेटमेंटमध्ये $.removeCookie('username') चालवून सत्र समाप्त करेल. त्यामुळे जर आपण कुकी काढू शकलो, तर आपल्याला लॉगआउट बटण काढून यशाचा संदेश दाखवावा लागेल आणि लॉगिन फॉर्म सादर करावा लागेल.

अनुमान मध्ये

अधिकृतता आणि इतर कारणांसाठी माहिती साठवण्यासाठी कुकीज अतिशय सोयीस्कर आहेत. तुम्ही युनिक आयडी कुकीज वापरून बॅकएंडमध्ये सत्रांवर चालणारे ऑनलाइन स्टोअर आयोजित करू शकता. ऑनलाइन स्टोअर्स आज खूप लोकप्रिय आहेत, आणि वेब डेव्हलपमेंटच्या क्षेत्रातील घडामोडी त्यांना व्यवस्थित आणि देखरेख करणे खूप सोपे करतात. तुम्ही कोडचे उदाहरण डाउनलोड करू शकता आणि हे उदाहरण तुम्ही तुमच्या स्वतःच्या प्रोजेक्टमध्ये कसे वापरू शकता ते तपासू शकता आणि कार्यक्षमता सुधारण्याचा प्रयत्न करू शकता.

कुकीज तुम्हाला तुमच्या वेबसाइटवर उत्कृष्ट अनुभव देण्यासाठी वापरकर्त्याबद्दल उपयुक्त माहिती साठवण्याची परवानगी देतात. तुम्ही त्यांच्यासोबत jQuery मध्ये देखील काम करू शकता. या ट्यूटोरियलमध्ये आम्ही काही वापरकर्ता प्राधान्ये संग्रहित करण्यासाठी jQuery आणि कुकीज कशा वापरू शकतो ते पाहू जेणेकरून विशिष्ट सामग्री प्रदर्शित करताना आम्ही त्यांचा वापर करू शकू.

चला सुरू करुया

आम्ही एकापेक्षा जास्त लेबल असलेले पॅनेल बनवणार आहोत. प्रत्येक वेळी तुम्ही लेबलवर क्लिक करता तेव्हा ते रंगात हायलाइट केले जाते आणि लेबलशी संबंधित मूल्य तुमच्या ब्राउझरचा वापर करून तुमच्या संगणकावरील कुकीमध्ये सेव्ह केले जाते. त्यानंतर तुम्ही कुकीमध्ये साठवलेले वर्तमान मूल्य प्रदर्शित करण्यासाठी किंवा कुकी हटविण्यासाठी दोन बटणे वापरू शकता.

तसेच, प्रथम डाउनलोड दरम्यान डेमो पृष्ठाकडे लक्ष द्या. कोणतेही लेबल हायलाइट केलेले नाहीत. आणि तुम्ही एक निवडल्यानंतर, तुम्ही डेमो पेज रिफ्रेश करू शकता आणि तुम्ही निवडलेले लेबल निवडलेले राहील. तुम्ही तुमच्या कुकीज साफ केल्यास, लेबलमधून हायलाइट काढला जाईल. आणि रीबूट केल्यानंतर, सर्व लेबले न निवडलेली राहतील. आता हे कसे कार्य करते ते पाहू.

jQuery सह कुकीज व्यवस्थापित करणे

आम्ही कुकीज व्यवस्थापित करण्यासाठी jQuery वापरणार आहोत, ज्यामध्ये कुकी स्टोरेजसह कार्य करण्यासाठी डिझाइन केलेले प्लगइन समाविष्ट असेल. प्लगइनचे नाव स्वतःसाठी बोलते - कुकी.

कुकी प्लगइन jQuery प्लगइन साइटच्या प्रकल्प विभागातून डाउनलोड केले जाऊ शकते.

कुकी हे फक्त एक कुकी() फंक्शन असलेले एक साधे प्लगइन आहे. या फंक्शनचा वापर करून, क्लायंटच्या संगणकावर कुकी मूल्ये जतन, पुनर्प्राप्त आणि हटविली जातात.

चिन्हांकित करणे

jQuery लायब्ररी कनेक्ट केल्यानंतर, आम्ही प्लगइन कनेक्ट करतो jquery.cookie.jsआमच्या HTML कोडमध्ये. मग आम्ही JavaScript फाइल समाविष्ट करतो, ज्यामध्ये कुकीजसह कार्य करण्यासाठी कोड असतो (आपण वापरून HTML कोडमध्ये स्क्रिप्ट मजकूर देखील समाविष्ट करू शकता.

HTML कोड अगदी सोपा दिसतो:

• बेसिक
• मानक
• विस्तारित

कुकीज दाखवा कुकीज हटवा

आम्ही कुकी स्थिती प्रदर्शित करण्यासाठी तीन लेबले, दोन लिंक्स आणि फील्ड तयार करतो. CSS फाईलमधील मजकूर धड्याच्या विषयाशी संबंधित नाही आणि फक्त .selected वर्ग वापरून निवडलेले लेबल हायलाइट करण्यासाठी वापरले जाते. चला तर सरळ JavaScript कोड वर जाऊ.

आम्ही कुकीज तयार करतो

त्यामुळे दस्तऐवज तयार झाल्यावर आमची स्क्रिप्ट कार्यान्वित करण्यासाठी आम्हाला नेहमीचा कोड जोडणे आवश्यक आहे:

JQuery(दस्तऐवज).रेडी(फंक्शन())(//स्क्रिप्ट कोड येथे ठेवला आहे));

आता काही व्हेरिएबल्स सुरू करूया जे नंतर आमच्या कोडमध्ये वापरले जातील. हे कुकीचे नाव आहे आणि कुकी फंक्शनचे पर्याय: कुकीचे जीवनकाळ आणि पृष्ठ पत्त्यावर जोडलेला मार्ग. इतर युक्तिवाद देखील शक्य आहेत, परंतु आमच्या धड्यात आम्ही फक्त हे दोन वापरू:

Var cookieName = "स्तर"; var cookieOptions = (कालबाह्य: 7, पथ: "/");

पुढे आम्हाला आमच्या कुकीमध्ये मूल्य तपासण्याची आवश्यकता आहे. जर ते नसेल तर पुढे जा. परंतु कुकीमध्ये मूल्य असल्यास, कुकीमध्ये आयडी सेव्ह केलेल्या लेबलसाठी तुम्हाला .सिलेक्टेड क्लास सेट करणे आवश्यक आहे. आम्ही एका पॅरामीटरसह कुकी फंक्शन वापरतो, जे कुकीचे नाव आहे ज्याचे मूल्य आम्हाला मिळणे आवश्यक आहे:

$("#" + $.cookie(cookieName)).addClass("निवडलेले");

आता आपण माउस क्लिक इव्हेंट हँडलर तयार करतो. प्रीव्हेंटडीफॉल्ट() फंक्शन ही एक मानक jQuery प्रक्रिया आहे जी ब्राउझरला लिंक फॉलो करण्यापासून प्रतिबंधित करते जेव्हा त्यावर माउस बटण क्लिक केले जाते. जेव्हा वापरकर्ता लेबलवर क्लिक करतो (जो प्रत्यक्षात एक दुवा आहे), आम्ही वर्ग काढून टाकतो .निवडलेसध्या निवडलेल्या लेबलमधून आणि नुकत्याच निवडलेल्यावर सेट करा.

$(".htabs a").क्लिक(function(e)(e.preventDefault(); $("#" + $.cookie(cookieName)).removeClass("selected");

कुकी तयार करण्याची आणि त्यावर मूल्य नियुक्त करण्याची वेळ आली आहे. पहिला युक्तिवाद कुकीचे नाव आहे, आमच्या उदाहरण स्तरामध्ये , आणि दुसरा युक्तिवाद कुकीला नियुक्त केले जाणारे मूल्य आहे. आम्ही फंक्शनला पर्याय देखील देतो.

आता लेबलमध्ये .selected वर्ग जोडूया:

$("#" + $.cookie(cookieName)).addClass("निवडलेले");));

कुकी मूल्य मिळवणे आणि प्रदर्शित करणे

आता आपल्याला कुकी मूल्य प्रदर्शित करणे आवश्यक आहे. आपल्याला फक्त एका पॅरामीटरसह कुकी फंक्शन कॉल करणे आवश्यक आहे, जे कुकीचे नाव आहे ज्याचे मूल्य आपल्याला आवश्यक आहे. जेव्हा #showCookie बटण क्लिक केले जाते, तेव्हा आम्ही फील्डमध्ये वर्तमान कुकी मूल्य रेकॉर्ड करतो #व्हर्बोज.

$("#showCookie").क्लिक(function(e)( e.preventDefault(); $("#verbose").val("कुकी मूल्य हे " + $.cookie(cookieName) + ".");) );

कुकीज हटवत आहे

आता आपल्याला कुकीज कशा हटवायच्या हे शोधण्याची आवश्यकता आहे. म्हणून, जेव्हा वापरकर्ता #deleteCookie बटणावर क्लिक करतो, तेव्हा आम्ही फील्डमध्ये आउटपुट करतो #व्हर्बोजकुकी हटवली गेली आहे हे दर्शवणारा संदेश. त्यानंतर आम्ही सध्या निवडलेल्या लेबलमधून .selected वर्ग काढून टाकतो.

$("#deleteCookie").क्लिक(function(e)( e.preventDefault(); $("#verbose").val("कुकी "लेव्हल" मूल्यासह \"" + $.cookie(cookieName) + " \" काढले." $("#" + $.cookie(cookieName)).removeClass("selected");

शेवटी, आम्ही कुकीज हटवतो. हा एक अतिशय मनोरंजक मुद्दा आहे. कोड असे दिसते:

$.cookie(cookieName, null, (path:"/"));

इतकंच. फंक्शनचा तिसरा आर्ग्युमेंट पाहू. आपण प्लगइन कोड पाहिल्यास jquery.cookie.js, नंतर असे दिसून येते की दुसऱ्या युक्तिवादाच्या मूल्यासह निरर्थकऑप्शन्स ॲरेमधील एक्सपायर्स व्हेरिएबलला मूल्य -1 नियुक्त केले आहे:

जर (मूल्य === शून्य) (मूल्य = ""; options.expires = -1;)

तर आम्ही पास झालो तर कुकी पर्यायतिसरा युक्तिवाद म्हणून, उदाहरणार्थ, यासारखे:

$.cookie(cookieName, $(this).attr("id"), cookieOptions);

नंतर आमच्या कोडचे ऑपरेशन विस्कळीत होईल, पासून cookieOptions.expiresमूल्य -1 घेईल, जे प्लगइनच्या तर्काशी पूर्णपणे जुळते.

आणि जर नकारात्मक मूल्य निर्दिष्ट केले असेल (म्हणजे भूतकाळातील तारीख), कुकी हटविली जाईल.

परंतु पथ निर्दिष्ट करणे आवश्यक आहे, कारण काही प्रकरणांमध्ये प्लगइनने पथ निर्दिष्ट केल्याशिवाय कुकीज हटवल्या नाहीत.

Reg.ru: डोमेन आणि होस्टिंग

रशियामधील सर्वात मोठा रजिस्ट्रार आणि होस्टिंग प्रदाता.

2 दशलक्षाहून अधिक डोमेन नावे सेवेत आहेत.

जाहिरात, डोमेन मेल, व्यवसाय उपाय.

जगभरातील 700 हजाराहून अधिक ग्राहकांनी आधीच त्यांची निवड केली आहे.

बूटस्ट्रॅप फ्रेमवर्क: जलद अनुकूली लेआउट

बूटस्ट्रॅप फ्रेमवर्कमधील अडॅप्टिव्ह लेआउटच्या मूलभूत गोष्टींवर चरण-दर-चरण व्हिडिओ कोर्स.

शक्तिशाली आणि व्यावहारिक साधन वापरून सहज, जलद आणि कार्यक्षमतेने टाइपसेटिंग कसे करायचे ते शिका.

ऑर्डर करण्यासाठी आणि पैसे मिळवण्यासाठी लेआउट.

विनामूल्य कोर्स "वर्डप्रेसवरील साइट"

तुम्हाला वर्डप्रेस सीएमएसमध्ये प्रभुत्व मिळवायचे आहे का?

वर्डप्रेसवर वेबसाइट डिझाइन आणि लेआउटचे धडे मिळवा.

थीम आणि कट लेआउटसह कार्य करण्यास शिका.

सीएमएस वर्डप्रेसवर वेबसाइट डिझाइन, लेआउट आणि इन्स्टॉलेशन रेखाटण्याचा विनामूल्य व्हिडिओ कोर्स!

*स्क्रोलिंगला विराम देण्यासाठी माउस वर करा.

मागे पुढे

jQuery आणि PHP वापरून कुकीज सेट करणे आणि वाचणे

HTTP हा एक प्रोटोकॉल आहे ज्यामध्ये "मेमरी" नाही, म्हणजेच, सर्व्हरवर येणारी प्रत्येक विनंती वेगळी मानली जाते, कोणत्याही प्रकारे इतर विनंत्यांशी कनेक्ट केलेली नाही. यामुळे तो स्वतः डेटा साठवू शकत नाही. तथापि, इंटरनेटच्या सुरुवातीच्या वर्षांमध्ये त्याच्या जलद आणि व्यापक अवलंबचे हे साधेपणा देखील एक कारण होते.

तथापि, विनंती दरम्यान माहिती जतन करण्याचा पर्याय आहे. हे कुकीज वापरून केले जाते. त्यांच्या मदतीने, आपण सत्रे प्रभावीपणे व्यवस्थापित करू शकता आणि आवश्यक डेटा जतन करू शकता.

कुकीजसह कार्य करण्याचे दोन मार्ग आहेत - सर्व्हरच्या बाजूला (PHP, ASP, इ.), आणि क्लायंट (ब्राउझर) बाजूला - JavaScript. या छोट्या लेखात आपण PHP आणि वापरून कुकीजमधून डेटा कसा तयार केला आणि वाचला जातो ते पाहू.

कुकीज आणि PHP

कुकीजची निर्मिती

PHP मध्ये कुकीज तयार करण्यासाठी, तुम्हाला setcookie() फंक्शन वापरावे लागेल. हे अनेक पॅरामीटर्स स्वीकारते (पहिले पॅरामीटर वगळता सर्व पर्यायी आहेत आणि वगळले जाऊ शकतात):

सेटकुकी("पृष्ठभेट", // कुकीचे नाव, आवश्यक पॅरामीटर $व्हिजिट, // कुकी वेळेचे मूल्य()+7*24*60*60, // ज्या वेळेसाठी कुकी सेट केली आहे - एक आठवडा अगोदर " /" , // फोल्डरचा मार्ग ज्यासाठी "साइट" कुकी उपलब्ध असेल // डोमेन ज्यावर कुकी बांधली जाईल);

तुम्ही कुकी एक्स्पायरेशन पॅरामीटर (हे डीफॉल्ट आहे) म्हणून "0" मूल्य पास केल्यास, ब्राउझर रीस्टार्ट झाल्यावर कुकी नष्ट होईल. "/" पॅरामीटरचा अर्थ असा आहे की कुकी या डोमेनवरील सर्व सबफोल्डर्ससाठी उपलब्ध असेल (आवश्यक असल्यास, तुम्ही कुकीला विशिष्ट निर्देशिकेशी "बाइंड" करू शकता, म्हणा, "/admin/" सारखे पॅरामीटर पास करून).

या फंक्शनसाठी दोन अतिरिक्त पॅरामीटर्स आहेत जे आम्ही लक्षात घेतलेले नाहीत. ते बुलियन मूल्यांद्वारे परिभाषित केले जातात. पहिला कुकीज फक्त सुरक्षित HTTPS प्रोटोकॉलवर पाठवल्या जातील की नाही हे निर्दिष्ट करते आणि दुसरे कुकीज JavaScript (PHP 5.2 मध्ये सादर केलेल्या) द्वारे प्रवेश करता येणार नाहीत किंवा नाही हे निर्दिष्ट करते.

बहुतेक व्यावहारिक समस्यांसाठी, पहिले चार पॅरामीटर्स पुरेसे आहेत, परंतु उर्वरित सामान्यतः वगळले जाऊ शकतात.

कुकीज वाचत आहे

PHP वापरून कुकीज वाचणे खूप सोपे आहे. स्क्रिप्टला नियुक्त केलेल्या सर्व कुकीज सुपरग्लोबल ॲरे $_COOKIE द्वारे प्रवेशयोग्य आहेत. आमच्या बाबतीत, कुकीचे मूल्य वाचण्यासाठी, आम्ही खालील लिहावे:

$visits = (int)$_COOKIE["pageVisits"]+1; echo "तुम्ही या साइटला भेट दिली: ".$visits." वेळा";

पुढील वेळी पृष्ठ लोड झाल्यावर setcookie() फंक्शन वापरून सेट केलेल्या कुकीज $_COOKIE ॲरेद्वारे उपलब्ध करून दिल्या जातात हे लक्षात घेण्याची ही चांगली वेळ आहे.

कुकीज हटवत आहे

कुकीज हटवण्यासाठी, त्याच setcookie() फंक्शनचा वापर केला जातो, जो या प्रकरणात भूतकाळातील कोणत्याही वेळी, कुकीचा “जीवनकाल” ठरवणारे पॅरामीटर म्हणून पास केले जाणे आवश्यक आहे.

Setcookie("pageVisits", $visited, time()-7*24*60*60, // एक आठवड्यापूर्वी. कुकी हटवली जाईल "/", "साइट");

कुकीज आणि jQuery

JQuery सह कुकीज वापरण्यासाठी तुम्हाला एका विशेष कुकी प्लगइनची आवश्यकता असेल.

कुकीजची निर्मिती

प्लगइन वापरून कुकीज तयार करणे खूप अंतर्ज्ञानी आहे:

$(document).ready(function())( // कुकी मांजरीच्या पिल्लांची स्थापना, ब्राउझर रीस्टार्ट केल्यानंतर अदृश्य होईल: $.cookie("मांजरीचे पिल्लू","सात मांजरीचे पिल्लू"); // डेमोकुकीची स्थापना (डेमोप्रमाणे ): $.cookie( "demoCookie", text,(expires: 7, path: "/", डोमेन: "site")); // "टेक्स्ट" हे व्हेरिएबल आहे ज्यामध्ये कुकी मूल्य सेव्ह केले जाते));

कुकीज वाचत आहे

वाचन आणखी सोपे आहे. तुम्हाला फक्त $.cookie() फंक्शनला एकाच पॅरामीटरसह कॉल करणे आवश्यक आहे - कुकीचे नाव. हे कुकी मूल्य परत करेल.

$(document).ready(function())( // कुकी मांजरीचे पिल्लू मिळवा: var str = $.cookie("मांजरीचे पिल्लू"); // str मध्ये आता "सात मांजरीचे पिल्लू" समाविष्ट आहेत);

कुकीज हटवत आहे

कुकी काढून टाकण्यासाठी, आम्ही पुन्हा $.cookie() फंक्शन वापरतो, परंतु दुसरे पॅरामीटर म्हणून "null" पास करतो.

$(document).ready(function())( // कुकी मांजरीचे पिल्लू हटवा: var str = $.cookie("मांजरीचे पिल्लू", null); // कुकी मांजरीचे पिल्लू यापुढे अस्तित्वात नाही));

सारांश करणे

या छोट्या लेखात आम्ही कुकीजमधून माहिती कशी सेट करायची आणि वाचायची हे पाहिले. हे लक्षात घेण्याची वेळ आली आहे की कुकीजने पासवर्ड, वापरकर्तानाव इ.सारखी महत्त्वाची माहिती संग्रहित करू नये, कारण प्रत्येक वेळी पृष्ठ लोड केल्यावर त्या नियमित शीर्षलेख म्हणून प्रसारित केल्या जातात आणि आक्रमणकर्त्यांद्वारे सहजपणे वाचल्या जाऊ शकतात. तथापि, योग्य सावधगिरीने, साइट अभ्यागतांशी संवाद साधताना हे साधे तंत्रज्ञान उच्च पातळीवरील संवाद साधू शकते.

tutorialzine.com वरील सामग्रीवर आधारित
अनुवाद - दिमित्री नौमेन्को

P.S. वेबसाइट बिल्डिंगच्या विविध पैलूंवरील प्रीमियम धडे, तसेच PHP मध्ये तुमची स्वतःची CMS प्रणाली सुरवातीपासून तयार करण्याचा विनामूल्य कोर्स पहा. हे सर्व तुम्हाला JavaScript आणि PHP जलद आणि सोपे शिकण्यास मदत करेल:

तुम्हाला सामग्री आवडली आणि मला धन्यवाद देऊ इच्छिता?
फक्त आपल्या मित्रांसह आणि सहकार्यांसह सामायिक करा!

हे देखील पहा:

कुकीज काय आहेत आणि ते कशासाठी आवश्यक आहेत यापासून सुरुवात करणे कदाचित योग्य आहे. कुकी हा डेटाचा एक भाग आहे जो वापरकर्त्याच्या बाजूला संग्रहित केला जाऊ शकतो आणि नंतर त्यांच्या कल्पना अंमलात आणण्यासाठी वापरला जाऊ शकतो.

चला कल्पना करूया की आपल्या वेबसाइटवर आपल्याला साइटची रंगसंगती निवडण्याची संधी आहे. कुकीजवर हे अंमलात आणणे खूप सोयीचे आहे, कारण त्याने निवडलेली थीम फक्त त्यालाच दृश्यमान असेल.

PHP आणि jQuery दोन्हीमध्ये कुकीज अस्तित्वात आहेत. म्हणून, आम्ही प्रत्येक प्रकरणाचा अधिक तपशीलवार विचार करू.

jQuery मध्ये कुकीजसह काम करण्यासाठी तपशीलवार सूचना

1. कुकीज सेट करत आहे

आता आम्ही आमची पहिली कुकी तयार करण्याचा प्रयत्न करू शकतो:

$.cookie("cookie_name", "cookie_value", ( कालबाह्य: 3, पथ: "/", डोमेन: "your_site.ru", सुरक्षित: खरे ));

इथे काय आहे?

"cookie_name" - कुकीचे नाव;

"cookie_value" - कुकी मूल्य;

"कालबाह्य" - कुकीज किती दिवस साठवल्या जातील (आमच्या बाबतीत - 3 दिवस). या वेळेनंतर, कुकीज स्वयंचलितपणे हटविल्या जातील;

"पथ" - साइटवर कुकीजची उपलब्धता (आमच्या बाबतीत "/" - संपूर्ण साइटवर उपलब्ध). तुमची इच्छा असल्यास, तुम्ही फक्त एक विशिष्ट पृष्ठ किंवा विभाग निर्दिष्ट करू शकता जिथे कुकीज उपलब्ध असतील, उदाहरणार्थ, “/ऑडिओ/रॉक”;

“डोमेन” – ज्या डोमेनवर कुकी वैध आहे. तुमच्याकडे सबडोमेन असल्यास, तुम्ही ते या पॅरामीटरमध्ये निर्दिष्ट करू शकता, उदाहरणार्थ, "डोमेन: "subdomain.your_site.ru"", आणि या प्रकरणात कुकी फक्त "subdomain.your_site.ru" डोमेनवर उपलब्ध असेल;

"सुरक्षित" – कुकी सुरक्षित https प्रोटोकॉलवर प्रसारित केली जावी हे दर्शविणारे पॅरामीटर.

येथे, सर्व पॅरामीटर्स आवश्यक नाहीत आणि कुकीज सेट करण्यासाठी, हे बांधकाम पुरेसे असेल:

$.cookie("cookie_name", "cookie_value", ( expires: 3, पथ: "/" ));

2. एक कुकी प्राप्त करत आहे

कुकीज मिळवणे अगदी सोपे आहे, तुम्ही हे कोड वापरून करू शकता:

$.cookie("cookie_name");

हा कोड व्हेरिएबलला नियुक्त केला जाऊ शकतो आणि तुमच्या गरजांसाठी वापरला जाऊ शकतो:

var सामग्री = $.cookie("cookie_name"); जर (सामग्री != शून्य) ( अलर्ट("कुकी अस्तित्वात आहे!"); ) इतर ( अलर्ट("कुकी अस्तित्वात नाही!");)

सहमत आहे, हे खूप सोयीस्कर आहे.

3. कुकीज काढत आहे

कुकी मूल्य काढून टाकण्यासाठी, ते "नल" वर सेट करा:

$.cookie("cookie_name", null);

माझ्या मते, jQuery मध्ये कुकीजसह काम करण्याच्या परिचयाचा शेवट आहे. हे ज्ञान तुमच्या कल्पना अंमलात आणण्यासाठी पुरेसे आहे.

PHP मध्ये कुकीजसह काम करण्यासाठी तपशीलवार सूचना

कुकीजसह कार्य करण्यासाठी मागील पर्यायाप्रमाणे, तुम्हाला येथे काहीही कनेक्ट करण्याची आवश्यकता नाही.

1. कुकीज सेट करत आहे

PHP मध्ये कुकीज सेट करण्यासाठी, आम्ही अंगभूत "सेटकुकी" फंक्शन वापरू:

इथे काय आहे?

"cookie_name" - कुकीचे नाव;

"cookie_value" - कुकी मूल्य;

"वेळ()+3600" - सेकंदांमध्ये कुकीचे आयुष्यभर (आमच्या बाबतीत - 1 तास). तुम्ही आजीवन "0" वर सेट केल्यास, ब्राउझर बंद होताच कुकी हटवली जाईल;

“/” – ज्या विभागात कुकीज उपलब्ध आहेत (आमच्या बाबतीत, संपूर्ण साइटवर उपलब्ध). ज्या विभागात कुकीज उपलब्ध होतील तो विभाग तुम्ही मर्यादित करू इच्छित असल्यास, नंतर “/” बदला, उदाहरणार्थ, “/ऑडिओ/रॉक”;

“your_site.ru” – डोमेन ज्यावर कुकी उपलब्ध असेल;

“true” – कुकी फक्त सुरक्षित https प्रोटोकॉलद्वारे उपलब्ध असल्याचे दर्शविणारे पॅरामीटर. अन्यथा मूल्य खोटे आहे;

“असत्य” – कुकी स्क्रिप्टिंग भाषांसाठी उपलब्ध असल्याचे दर्शविणारा पॅरामीटर. अन्यथा – सत्य (केवळ http द्वारे उपलब्ध).

येथे देखील, सर्व पॅरामीटर्स आवश्यक नाहीत आणि कुकीज तयार करण्यासाठी आपल्याला फक्त खालील बांधकामांची आवश्यकता असेल:

सोयीसाठी, कुकी मूल्य व्हेरिएबलद्वारे सेट केले जाऊ शकते:

2. एक कुकी प्राप्त करत आहे

कुकीज प्राप्त करण्यासाठी, आपण हे वापरणे आवश्यक आहे:

$_COOKIE["cookie_name"];

कुकीच्या संभाव्य अनुपस्थितीमुळे त्रुटी दूर करण्यासाठी, त्याचे अस्तित्व तपासा:

jQuery मध्ये कुकीजसह काम करण्याच्या मागील उदाहरणाप्रमाणे, कुकीज व्हेरिएबलला नियुक्त केल्या जाऊ शकतात:

3. कुकीज काढत आहे

PHP मध्ये कुकीज काढणे jQuery प्रमाणेच सोपे आहे. तुम्हाला फक्त कुकी रिकाम्या मूल्यावर आणि नकारात्मक वेळेवर सेट करायची आहे (आधीच निघून गेलेली वेळ):

सेटकुकी("कुकी_नाव", "", वेळ() - 3600);

या उदाहरणातील वेळ एक तासापूर्वीचा आहे, जो कुकीज हटवण्यासाठी पुरेसा आहे.

मी हे लक्षात घेऊ इच्छितो की काही प्रकरणांमध्ये, आवश्यक कार्यक्षमतेची अंमलबजावणी करण्यासाठी डेटाबेस वापरण्यापेक्षा कुकीज वापरणे अधिक तर्कसंगत आहे.