คุกกี้ (Cookie) คืออะไร?
คุกกี้เป็นตัวแปรที่เก็บไปไว้ในคอมพิวเตอร์ของผู้เข้าชม เวลาร้องขอหน้าคอมพิวเตอร์เครื่องเดียวกันกับเบราว์เซอร์ ก็จะส่งคุกกี้ไป กับ JavaScript, จะสามารถสร้างและเรียกค่าคุกกี้ได้
ตัวอย่างของคุกกี้:
Name cookie - ครั้งแรกที่ผู้เข้าชมมาถึงหน้าเว็บของคุณเขาหรือเธอจะต้องกรอกข้อมูลลงใน / ชื่อของตน ชื่อแล้วเก็บไว้ในคุกกี้ ครั้งต่อไปที่ผู้เข้าชมมาถึงที่หน้าของคุณเขาหรือเธออาจจะได้รับข้อความต้อนรับเช่น "ยินดีต้อนรับคุณ หื่น" ชื่อถูกดึงจากคุกกี้ที่เก็บไว้
Date cookie - ครั้งแรกที่ผู้เข้าชมมาถึงหน้าเว็บของคุณเป็นวันที่ปัจจุบันถูกเก็บไว้ในคุกกี้ ครั้งต่อไปที่ผู้เข้าชมมาถึงที่หน้าของคุณเขาหรือเธออาจจะได้รับข้อความเช่น "เข้าชมล่าสุดเมื่อวันอังคารที่ 11 สิงหาคม 2013" วันที่จะถูกดึงออกมาจากคุกกี้ที่เก็บไว้
สร้างและเก็บคุกกี้
ในตัวอย่างนี้ เราจะสร้างคุกกี้ที่เก็บชื่อของผู้เข้าชมครั้งแรกที่ผู้เข้าชมมาถึงหน้าเว็บ หรือคุณอาจถูกขอให้กรอกข้อมูลลงใน / his name แล้วเก็บไว้ในคุกกี้ ครั้งต่อไปที่ผู้เข้าชมมาถึงที่หน้าเดียวกันเขาก็จะได้รับข้อความต้อนรับของ
ครั้งแรกที่เราสร้างฟังก์ชันที่เก็บชื่อของผู้เข้าชมในตัวแปรคุกกี้:
***********************************************************
function setCookie(c_name,value,exdays)
{
var exdate=new Date();
exdate.setDate(exdate.getDate() + exdays);
var c_value=escape(value) + ((exdays==null) ? "" : "; expires="+exdate.toUTCString());
document.cookie=c_name + "=" + c_value;
}
***********************************************************
พารามิเตอร์ของฟังก์ชั่นดังกล่าวข้างต้น ถือชื่อของคุกกี้ ค่าของคุกกี้และจำนวนวันจนกว่าคุกกี้จะหมดอายุ
ในฟังก์ชั่นดังกล่าวข้างต้นครั้งแรกที่เราแปลงจำนวนวันไปยังวันที่ที่ถูกต้องแล้วเราเพิ่มจำนวนวันจนกว่าคุกกี้ควรหมดอายุ หลังจากที่เราเก็บชื่อคุกกี้ค่าคุกกี้และวันหมดอายุในวัตถุ document.cookie
Get a Cookie Value
จากนั้นเราจะสร้างฟังก์ชันที่ส่งกลับค่าจากคุกกี้ที่ระบุอื่น:
************************************************************
function getCookie(c_name)
{
var c_value = document.cookie;
var c_start = c_value.indexOf(" " + c_name + "=");
if (c_start == -1)
{
c_start = c_value.indexOf(c_name + "=");
}
if (c_start == -1)
{
c_value = null;
}
else
{
c_start = c_value.indexOf("=", c_start) + 1;
var c_end = c_value.indexOf(";", c_start);
if (c_end == -1)
{
c_end = c_value.length;
}
c_value = unescape(c_value.substring(c_start,c_end));
}
return c_value;
}
************************************************************
โค้ดดังกล่าว ใช้วิธีการ indexOf () เพื่อค้นหาชื่อคุกกี้ภายในสตริงคุกกี้ของเอกสาร
indexOf แรก () วิธีการจะกลับมาตำแหน่งที่คุกกี้จะถูกพบ "" + และ + "=" จะถูกเพิ่มเพื่อให้วิธีการที่ไม่พบชื่อหรือค่า containing
หากวิธีการส่งกลับ -1, คุกกี้อาจจะยังคงอยู่ในช่วงเริ่มต้นของสตริงคุกกี้ ที่จะกำจัดนี้ค้นหาอื่นมีการเพิ่มเวลาโดยไม่ต้องนี้ "+"
Check a Cookie Value
ที่ผ่านมาเราสร้างฟังก์ชันที่แสดงข้อความต้อนรับถ้าการตั้งค่าคุกกี้และถ้าคุกกี้ไม่ได้ตั้งค่าจะแสดงกล่องแจ้งขอชื่อของผู้ใช้และจัดเก็บชื่อผู้ใช้คุกกี้สำหรับ 365 วันโดยเรียก ฟังก์ชั่น SetCookie:
****************************************************************************
function checkCookie()
{
var username=getCookie("username");
if (username!=null && username!="")
{
alert("Welcome again " + username);
}
else
{
username=prompt("Please enter your name:","");
if (username!=null && username!="")
{
setCookie("username",username,365);
}
}
}
****************************************************************************
เมื่อรวมเข้าด้วยกันจะได้ ตามลิงค์นี้ http://www.w3schools.com/js/tryit.asp?filename=tryjs_cookie_username
