คุกกี้ JavaScript
คุกกี้สำหรับข้อมูลของผู้ใช้จะถูกเก็บไว้ในหน้าเว็บ
คุกกี้คืออะไร
คุกกี้เป็นข้อมูลที่เก็บไว้ในแฟ้มข้อความในคอมพิวเตอร์ของคุณ
เมื่อเว็บเซิร์ฟเวอร์ส่งหน้าเว็บเบราว์เซอร์หลังจากที่การเชื่อมต่อจะปิดเซิร์ฟเวอร์ไม่ได้บันทึกข้อมูลของผู้ใช้
บทบาทคุกกี้คือการแก้ปัญหา "วิธีการบันทึกข้อมูลผู้ใช้ของลูกค้า"
- เมื่อผู้ใช้เข้าชมหน้าเว็บที่ชื่อของเขาจะถูกบันทึกไว้ในคุกกี้
- เมื่อครั้งต่อไปที่ผู้ใช้เข้าถึงหน้าเว็บที่คุณสามารถอ่านบันทึกเข้าถึงของผู้ใช้ในคุกกี้
คุกกี้ที่มีคู่ค่าชื่อ / จะถูกเก็บไว้ดังต่อไปนี้:
เมื่อเบราว์เซอร์ร้องขอหน้าเว็บจากเซิร์ฟเวอร์, คุกกี้ที่เป็นหน้าจะถูกเพิ่มลงในการร้องขอ เซิร์ฟเวอร์ที่จะได้รับข้อมูลของผู้ใช้ในลักษณะนี้
ใช้ JavaScript ในการสร้างคุกกี้
คุณสมบัติ document.cookie JavaScript สามารถใช้ในการสร้างอ่านและลบคุกกี้
JavaScript, สร้างคุกกี้ดังต่อไปนี้:
นอกจากนี้คุณยังสามารถเพิ่มเวลาหมดอายุของคุกกี้ (เวลา UTC หรือเวลา GMT) โดยค่าเริ่มต้นคุกกี้ลบเมื่อเบราว์เซอร์ที่มีการปิด:
คุณสามารถใช้พารามิเตอร์เส้นทางบอกเส้นทางคุกกี้เบราว์เซอร์ โดยค่าเริ่มต้นคุกกี้เป็นหน้าปัจจุบัน
ใช้งาน JavaScript เพื่ออ่านคุกกี้
ใน JavaScript, คุณสามารถใช้รหัสต่อไปนี้เพื่ออ่านคุกกี้:
สตริง document.cookie จะกลับลักษณะของคุกกี้ชนิดรูปแบบ: cookie1 = ค่า; cookie2 = ค่า; cookie3 = ค่า; |
แก้ไข Cookie โดยใช้ JavaScript
ใน JavaScript แก้ไขคุกกี้คล้ายกับการสร้างคุกกี้ดังต่อไปนี้:
คุกกี้เก่าจะถูกเขียนทับ
ลบคุกกี้โดยใช้ JavaScript
ลบคุกกี้เป็นเรื่องง่ายมาก คุณจะต้องตั้งค่าพารามิเตอร์สำหรับครั้งก่อนหน้านี้หมดอายุที่แสดงด้านล่างถูกตั้งค่าให้ Thu, 1 มกราคม 1970 00:00:00 GMT:
โปรดทราบว่าเมื่อคุณลบโดยไม่ได้ระบุค่าของคุกกี้
สตริงคุกกี้
คุณสมบัติ document.cookie ดูเหมือนสตริงข้อความธรรมดาในความเป็นจริงมันไม่ได้เป็น
แม้ว่าคุณจะเขียน document.cookie สตริงคุกกี้สมบูรณ์ข้อมูลคุกกี้เมื่อคุณอีกครั้งอ่านข้อมูลคุกกี้คือชื่อ / คู่ค่าในรูปแบบของการแสดงผล
ถ้าคุณตั้งค่าคุกกี้ใหม่คุกกี้เก่าจะไม่ถูกเขียนทับ คุกกี้ใหม่จะถูกเพิ่มลง document.cookie ดังนั้นหากคุณอีกครั้งอ่าน document.cookie คุณจะได้รับข้อมูลดังต่อไปนี้:
cookie1 = ค่า; cookie2 = ค่า;
หากคุณต้องการหาค่าคุกกี้เฉพาะคุณต้องสร้างฟังก์ชัน JavaScript เพื่อหาค่าของคุกกี้ในสตริงคุกกี้
กรณี JavaScript คุกกี้
ในตัวอย่างต่อไปนี้เราจะสร้างคุกกี้ในการจัดเก็บชื่อของผู้เข้าชมที่
ครั้งแรกที่ผู้เข้าชมหน้าเว็บที่เขาจะถูกขอให้กรอกชื่อของพวกเขา ชื่อที่จะถูกเก็บไว้ในคุกกี้
ครั้งต่อไปที่คุณสามารถเข้าถึงหน้าเว็บที่ผู้เข้าชมที่เขาจะเห็นข้อความต้อนรับ
ในตัวอย่างนี้เราจะสร้างสามฟังก์ชัน javascript:
- ค่าคุกกี้ Setter
- ได้รับค่าฟังก์ชั่นคุกกี้
- ฟังก์ชั่นตรวจจับค่าคุกกี้
ค่าคุกกี้ Setter
ครั้งแรกที่เราสร้างฟังก์ชั่นสำหรับการจัดเก็บชื่อของผู้เข้าชมไปนี้:
{
var d = new Date();
d.setTime(d.getTime()+(exdays*24*60*60*1000));
var expires = "expires="+d.toGMTString();
document.cookie = cname + "=" + cvalue + "; " + expires;
}
ความละเอียดของฟังก์ชั่น:
มากกว่าหนึ่งค่าฟังก์ชันชื่อคุกกี้สำหรับ CNAME ที่ cvalue ค่าคุกกี้และตั้งเวลาหมดอายุของคุกกี้หมดอายุ
ฟังก์ชั่นนี้จะตั้งชื่อคุกกี้ค่าคุกกี้เวลาหมดอายุคุกกี้
ได้รับค่าฟังก์ชั่นคุกกี้
จากนั้นเราจะสร้างฟังก์ชั่นที่ส่งกลับให้ผู้ใช้สามารถระบุค่าของคุกกี้ไปนี้:
{
var name = cname + "=";
var ca = document.cookie.split(';');
for(var i=0; i<ca.length; i++)
{
var c = ca[i].trim();
if (c.indexOf(name)==0) return c.substring(name.length,c.length);
}
return "";
}
ความละเอียดของฟังก์ชั่น:
ชื่อพารามิเตอร์คุกกี้เป็น CNAME
สร้างตัวแปรข้อความจะถูกใช้ในการดึงคุกกี้ที่ระบุ: + CNAME "="
ใช้อัฒภาคสตริง document.cookie แยกต่างหากและได้รับมอบหมายให้ CA สตริงอาร์เรย์แบ่ง (CA = document.cookie.split ( ';'))
อาร์เรย์วงจรแคลิฟอร์เนีย (i = 0; i <ca.length; i ++) แล้วอ่านแต่ละค่าในอาร์เรย์และการกำจัดของช่องว่างต่อท้ายนี้ (c = CA [I] .trim ())
หากคุณพบคุกกี้ (c.indexOf (ชื่อ) == 0), ส่งกลับค่าคุกกี้ (c.substring (name.length, c.length)
ถ้าคุณไม่พบคุกกี้กลับ "."
ฟังก์ชั่นตรวจจับค่าคุกกี้
สุดท้ายเราสามารถสร้างฟังก์ชั่นการตรวจสอบว่าคุกกี้จะถูกสร้างขึ้น
หากคุณตั้งค่าคุกกี้ก็จะแสดงข้อความอวยพร
หากคุณไม่ได้ตั้งค่าคุกกี้ก็จะแสดงป๊อปอัพที่สอบถามชื่อของผู้เข้าชมและเรียกชื่อ setcookie การจัดเก็บข้อมูลการทำงานของผู้เข้าชม 365 วัน:
{
var username=getCookie("username");
if (username!="")
{
alert("Welcome again " + username);
}
else
{
username = prompt("Please enter your name:","");
if (username!="" && username!=null)
{
setCookie("username",username,365);
}
}
}
ตัวอย่างที่สมบูรณ์
ตัวอย่าง
{
var d = new Date();
d.setTime(d.getTime()+(exdays*24*60*60*1000));
var expires = "expires="+d.toGMTString();
document.cookie = cname + "=" + cvalue + "; " + expires;
}
function getCookie(cname)
{
var name = cname + "=";
var ca = document.cookie.split(';');
for(var i=0; i<ca.length; i++)
{
var c = ca[i].trim();
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);
}
else
{
user = prompt("Please enter your name:","");
if (user!="" && user!=null)
{
setCookie("username",user,365);
}
}
}
ลอง»
ตัวอย่างต่อไปนี้ดำเนินการ checkCookie ฟังก์ชั่น () เมื่อโหลดหน้าเว็บ