JavaScript và Cookie

Cookies là gì?

Khóa học java miễn phí

Trình duyệt web và máy chủ sử dụng giao thức HTTP để giao tiếp và HTTP là giao thức không trạng thái. Nhưng đối với một trang web thương mại, nó là cần thiết để duy trì thông tin phiên trong số các trang khác nhau. Ví dụ: một đăng ký người dùng kết thúc sau khi hoàn thành nhiều trang. Nhưng làm thế nào để duy trì thông tin phiên của người dùng trên tất cả các trang web.

Trong nhiều trường hợp, sử dụng cookie là phương pháp ghi nhớ và theo dõi tùy chọn hiệu quả nhất, mua hàng, hoa hồng và các thông tin khác cần thiết để có được trải nghiệm khách truy cập hoặc thống kê trang web tốt hơn.

Link đăng ký khóa học : Khóa học java miễn phí.

Làm thế nào nó hoạt động ?

Máy chủ của bạn gửi một số dữ liệu đến trình duyệt của khách truy cập dưới dạng cookie. Trình duyệt có thể chấp nhận cookie. Nếu có, nó được lưu trữ dưới dạng bản ghi văn bản thuần túy trên ổ cứng của khách truy cập. Bây giờ, khi khách truy cập đến một trang khác trên trang web của bạn, trình duyệt sẽ gửi cùng một cookie đến máy chủ để truy xuất. Sau khi truy xuất, máy chủ của bạn biết / nhớ những gì đã được lưu trữ trước đó.

Cookie là bản ghi dữ liệu văn bản thuần túy gồm 5 trường có độ dài thay đổi

Hết hạn - Ngày cookie sẽ hết hạn. Nếu điều này trống, cookie sẽ hết hạn khi khách truy cập thoát khỏi trình duyệt.

Tên miền - Tên miền của trang web của bạn.

Đường dẫn - Đường dẫn đến thư mục hoặc trang web đặt cookie. Điều này có thể trống nếu bạn muốn truy xuất cookie từ bất kỳ thư mục hoặc trang nào.

Bảo mật - Nếu trường này chứa từ "an toàn", thì cookie chỉ có thể được truy xuất bằng máy chủ bảo mật. Nếu trường này trống, không có hạn chế nào tồn tại.

Tên = Giá trị - Cookie được đặt và truy xuất dưới dạng cặp khóa-giá trị

Cookie ban đầu được thiết kế để lập trình CGI. Dữ liệu trong cookie được tự động truyền giữa trình duyệt web và máy chủ web, vì vậy các tập lệnh CGI trên máy chủ có thể đọc và ghi các giá trị cookie được lưu trữ trên máy khách.

JavaScript cũng có thể thao tác cookie bằng cách sử dụng thuộc tính cookiecủa đối tượng Document . JavaScript có thể đọc, tạo, sửa đổi và xóa các cookie áp dụng cho trang web hiện tại.

Lưu trữ Cookies

Cách đơn giản nhất để tạo cookie là gán giá trị chuỗi cho đối tượng document.cookie, trông giống như thế này.

document.cookie = "key1=value1;key2=value2;expires=date";

Ở đây thuộc tính hết hạn là tùy chọn. Nếu bạn cung cấp thuộc tính này với ngày hoặc giờ hợp lệ, thì cookie sẽ hết hạn vào một ngày hoặc giờ nhất định và sau đó, giá trị của cookie sẽ không thể truy cập được.

Lưu ý - Giá trị cookie có thể không bao gồm dấu chấm phẩy, dấu phẩy hoặc khoảng trắng. Vì lý do này, bạn có thể muốn sử dụng hàm JavaScript escape () để mã hóa giá trị trước khi lưu trữ nó trong cookie. Nếu bạn làm điều này, bạn cũng sẽ phải sử dụng hàm unescape () tương ứng khi bạn đọc giá trị cookie.

Thí dụ

Hãy thử những điều sau đây. Nó đặt tên khách hàng trong cookie đầu vào.

<html>
   <head>
      
      <script type = "text/javascript">
         <!--
            function WriteCookie()
            {
               if( document.myform.customer.value == "" ){
                  alert("Enter some value!");
                  return;
               }
               cookievalue= escape(document.myform.customer.value) + ";";
               document.cookie="name=" + cookievalue;
               document.write ("Setting Cookies : " + "name=" + cookievalue );
            }
         //-->
      </script>
      
   </head>
   
   <body>
   
      <form name="myform" action="">
         Enter name: <input type="text" name="customer"/>
         <input type="button" value="Set Cookie" onclick="WriteCookie();"/>
      </form>
   
   </body>
</html>

Đầu ra

Bây giờ máy của bạn có một cookie gọi là tên . Bạn có thể đặt nhiều cookie bằng cách sử dụng nhiều cặp khóa = giá trị được phân tách bằng dấu phẩy.

Đọc cookie

Đọc một cookie đơn giản như viết một, vì giá trị của đối tượng document.cookie là cookie. Vì vậy, bạn có thể sử dụng chuỗi này bất cứ khi nào bạn muốn truy cập cookie. Chuỗi document.cookie sẽ giữ một danh sách các cặp name = value được phân cách bằng dấu chấm phẩy, trong đó name là tên của một cookie và giá trị là giá trị chuỗi của nó.

Bạn có thể sử dụng hàm split () của chuỗi để ngắt chuỗi thành khóa và các giá trị như sau:

Thí dụ

Hãy thử ví dụ sau để lấy tất cả cookie.

<html>
   <head>
   
      <script type="text/javascript">
         <!--
            function ReadCookie()
            {
               var allcookies = document.cookie;
               document.write ("All Cookies : " + allcookies );
               
               // Get all the cookies pairs in an array
               cookiearray = allcookies.split(';');
               
               // Now take key value pair out of this array
               for(var i=0; i<cookiearray.length; i++){
                  name = cookiearray[i].split('=')[0];
                  value = cookiearray[i].split('=')[1];
                  document.write ("Key is : " + name + " and Value is : " + value);
               }
            }
         //-->
      </script>
      
   </head>
   <body>
      
      <form name="myform" action="">
         <p> click the following button and see the result:</p>
         <input type="button" value="Get Cookie" onclick="ReadCookie()"/>
      </form>
      
   </body>
</html>

Lưu ý - Chiều dài ở đây là một phương thức của lớp Array trả về độ dài của một mảng. Chúng ta sẽ thảo luận về mảng trong một chương riêng biệt. Vào lúc đó, hãy cố gắng tiêu hóa nó.

Lưu ý - Có thể có một số cookie khác đã được đặt trên máy của bạn. Mã trên sẽ hiển thị tất cả các cookie được đặt trên máy của bạn.

Đặt ngày hết hạn cho cookie

Bạn có thể kéo dài tuổi thọ của cookie ngoài phiên trình duyệt hiện tại bằng cách đặt ngày hết hạn và lưu ngày hết hạn trong cookie. Điều này có thể được thực hiện bằng cách đặt thuộc tính 'hết hạn' thành ngày và giờ.

Thí dụ

Hãy thử ví dụ sau. Nó minh họa cách kéo dài ngày hết hạn của cookie lên 1 tháng.

<html>
   <head>
   
      <script type="text/javascript">
         <!--
            function WriteCookie()
            {
               var now = new Date();
               now.setMonth( now.getMonth() + 1 );
               cookievalue = escape(document.myform.customer.value) + ";"
               
               document.cookie="name=" + cookievalue;
               document.cookie = "expires=" + now.toUTCString() + ";"
               document.write ("Setting Cookies : " + "name=" + cookievalue );
            }
         //-->
      </script>
      
   </head>
   <body>
   
      <form name="myform" action="">
         Enter name: <input type="text" name="customer"/>
         <input type="button" value="Set Cookie" onclick="WriteCookie()"/>
      </form>
      
   </body>
</html>

Đầu ra

Xóa cookie

Đôi khi bạn sẽ muốn xóa một cookie để các lần thử sau đó đọc cookie không trả lại gì cả. Để làm điều này, bạn chỉ cần đặt ngày hết hạn cho một thời gian trong quá khứ.

Thí dụ

Hãy thử ví dụ sau. Nó minh họa cách xóa cookie bằng cách đặt ngày hết hạn của nó thành một tháng sau ngày hiện tại.

<html>
   <head>
   
      <script type="text/javascript">
         <!--
            function WriteCookie()
            {
               var now = new Date();
               now.setMonth( now.getMonth() - 1 );
               cookievalue = escape(document.myform.customer.value) + ";"
               
               document.cookie="name=" + cookievalue;
               document.cookie = "expires=" + now.toUTCString() + ";"
               document.write("Setting Cookies : " + "name=" + cookievalue );
            }
          //-->
      </script>
      
   </head>
   <body>
   
      <form name="myform" action="">
         Enter name: <input type="text" name="customer"/>
         <input type="button" value="Set Cookie" onclick="WriteCookie()"/>
      </form>
      
   </body>
</html>

JAVA - NIIT-ICT

Thứ Hai, 29 tháng 10, 2018