জেভাস্ক্রিপ্ট কুকিজ
- পূর্ববর্তী পৃষ্ঠা 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=/";
জাভাস্ক্রিপ্ট দ্বারা কুকি পড়া
জাভাস্ক্রিপ্ট দ্বারা কুকি পড়া
var x = document.cookie;
document.cookie সমস্ত কুকি একটি স্ট্রিং-এ ফিরিয়ে দেবে, যেমন: cookie1=value; cookie2=value; cookie3=value;
জাভাস্ক্রিপ্ট দ্বারা কুকি পরিবর্তন
জাভাস্ক্রিপ্ট ব্যবহার করে, আপনি যেমন কুকি তৈরি করেছেন, তেমনই তা পরিবর্তন করতে পারেন:
document.cookie = "username=Steve Jobs; expires=Sun, 31 Dec 2017 12:00:00 UTC; path=/";
পুরনো কুকি মিটানো হবে。
জাভাস্ক্রিপ্ট দ্বারা কুকি মিটানো
কুকি মিটানো খুবই সহজ。
কুকি মিটানোর সময় কুকি মূল্য নির্দিষ্ট করতে হবে না:
সরাসরি expires পরিমাণটিকে অতীতের তারিখ নির্ধারণ করেন তাকে:
document.cookie = "username=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";
আপনি যেমন কুকি মিটানোর জন্য যেভাবে পথ নির্দিষ্ট করেন, তেমনই কুকি মিটানোর জন্যও পথ নির্দিষ্ট করতে হবে。
যদি আপনি পথ নির্দিষ্ট না করেন, তবে কিছু ব্রাউজার কুকি মিটানোর অনুমতি দেবে না。
কুকি স্ট্রিং
document.cookie এই বৈশিষ্ট্যটি একটি সাধারণ টেক্সট স্ট্রিং-এর মতো দেখা যায়। কিন্তু তা নয়।
আমরা যদি না করি, document.cookie একটি সম্পূর্ণ cookie স্ট্রিং লিখুন, যখন পরে পড়লে, আপনি শুধুমাত্র তার নাম-মূল্য যুগ্ম দেখতে পাবেন。
নতুন কুকি সেট করা হলে, পুরনো কুকি মিটানো হবে না। নতুন কুকি document.cookie-এ যোগ করা হবে, তাই আপনি document.cookie পড়লে, আপনি এমনভাবে পাবেন:
cookie1 = value; cookie2 = value;
যদি আপনি একটি নির্দিষ্ট cookie-র মান খুঁজতে চান, তবে আপনাকে cookie-র স্ট্রিং-এর মান খুঁজার জন্য JavaScript ফাংশন লিখতে হবে。
JavaScript Cookie-র উদাহরণ
নিচের উদাহরণে, আমরা একটি cookie তৈরী করবো যা ব্যবহারকারীর নাম সংরক্ষণ করবে。
ব্যবহারকারীর প্রথমবার পৃষ্ঠা পৌঁছালে, তখন তাকে নাম দিতে বলা হবে। তারপর, তা কুকি-তে সংরক্ষণ করা হবে。
পরবর্তীকালের ব্যবহারকারীর যখন একই পৃষ্ঠা পৌঁছেছে, তখন তাকে একটি স্বাগতমূলক বার্তা পাওয়া যাবে。
উদাহরণ, আমরা ৩টি JavaScript ফাংশন তৈরী করবো:
- 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-র মান ফিরিয়ে দেয়:
প্রকল্পবিধি
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 �ুয়ান্টি স্ট্রিং ডিকোড করুন, বিশেষ চরিত্রসমূহসহ কুকি সম্পর্কে প্রক্রিয়াকরণ করুন, যেমন “$”।
ডকুমেন্ট.কুকি'কে সম্মিশ্র করে পদক্ষেপ নাম করা হয় (ca = decodedCookie.split(';')) একটি অ্যারে সম্মিশ্র করা হয়।
ক্যুয়ান্টি অ্যারে প্রবেশ করুন (i = 0; i < ca.length; i++), এবং প্রত্যেকটি মান c = ca[i] পড়া নিন。
যদি কুকি (c.indexOf(name) == 0) পাওয়া যায়, তবে তা কুকির মান (c.substring(name.length, c.length)) ফিরিয়ে দেয়。
যদি কুকি না পাওয়া যায়, তবে "" ফিরিয়ে দেয়。
কুকি পরীক্ষা করার ফাংশন
শেষপর্যন্ত, আমরা কুকি সেট করা হয়নি কিনা তা পরীক্ষা করার ফাংশন তৈরি করি。
যদি কুকি সেট করা হয়, তবে একটি স্বাগত বার্তা দেখানো হবে。
যদি কুকি না সেট করা হয়, তবে একটি প্রশ্নপত্র দেখানো হবে, যাতে ব্যবহারকারীর নাম প্রশ্ন করা হবে, এবং নামকুকি ৩৬৫ দিন ধরে সংরক্ষণ করা হবে, যার জন্য 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 টাইমিং
- পরবর্তী পৃষ্ঠা ওয়েব এপিআই সম্পর্কে
