Thực đơn
trang chủSự cố

Plugin tải xuống Jquery cookie min js. Cài đặt và đọc cookie bằng jQuery và PHP. Hướng dẫn chi tiết làm việc với Cookies trong jQuery

Hôm nọ tôi quyết định xem xét kỹ hơn về cookie: cách chúng hoạt động, cách chúng được thiết kế, cách sử dụng chúng. Vì sự hiểu biết cuối cùng người ta đã quyết định tải xuống một plugin để làm việc với cookie trên Jquery. Một liên kết đến plugin được đính kèm Cookie Plugin cho jQuery.

Tôi sẽ bắt đầu với lý thuyết. Cookie là một phần không thể thiếu Giao thức HTTP. Từ máy chủ cookie cho khách hàngđược truyền trong tiêu đề phản hồi HTTP của máy chủ. Chính xác hơn - trong trường Set-Cookie của tiêu đề này. Trường Set-Cookie có thể chứa dữ liệu từ nhiều cookie. Ngoài ra, tiêu đề phản hồi HTTP có thể chứa một số trường Set-Cookie. Định dạng của trường Set-Cookie trong tiêu đề phản hồi HTTP của máy chủ được đưa ra bên dưới:

Đặt-Cookie:< name>=< value> [ ; < name>=< value> ] ...
[ ; hết hạn=< date>] [ ; tên miền=< domain_name> ]
[ ; đường dẫn=< some_path>] [ ; chắc chắn][; httponly]

Có thể thấy, dòng Set-Cookie của tiêu đề phản hồi của máy chủ bao gồm một chuỗi các chuỗi con được phân tách bằng ký tự ";" (dấu chấm phẩy). Một hoặc nhiều = cặp theo sau trước. Mỗi cặp này tương ứng với một cookie có tên tên và giá trị giá trị. Sau đó làm theo các thuộc tính mà cookie chứa trong trường Set-Cookie này được đặt. Sau đây là mô tả về các giá trị thuộc tính cookie.

  • Thuộc tính hết hạn. Được chỉ định ở định dạng: Expires= . Xác định ngày và giờ hết hạn do trường Set-Cookie này đặt trong tiêu đề phản hồi HTTP của máy chủ cookie. Giá trị phải là một chuỗi chỉ định Giờ Kinh tuyến Greenwich (GMT) ở định dạng "DAY, DD-MMM-YYYY HH:MM:SS GMT" (ví dụ: "Thứ Ba, ngày 28 tháng 2 năm 2006 12:41:04 GMT") . Khi cookie hết hạn, nó sẽ bị trình duyệt xóa. Nếu thuộc tính hết hạn không được đặt (ngày hết hạn của cookie không được đặt), cookie sẽ bị xóa khi trình duyệt thoát. Những cookie này được gọi là cookie “phiên” (chúng chỉ có hiệu lực cho đến khi kết thúc phiên hiện tại).
  • thuộc tính miền. Được chỉ định ở định dạng domain= . Chỉ định phần cuối của tập hợp tên miền trong đó cookie được đặt là hợp lệ. Ví dụ: nếu khi đặt cookie, giá trị là .codeguru.ru, các cookie đã cài đặt sẽ được gửi đến máy chủ khi yêu cầu tài liệu từ các trang web nằm trên các miền web.codeguru.ru, forum.codeguru.ru, v.v. trong đó Điều kiện bổ sung việc gửi cookie sẽ kiểm tra giá trị của thuộc tính đường dẫn - xem bên dưới. Thuộc tính miền khá hữu ích. Nó có thể được sử dụng, ví dụ, để tổ chức hệ thống thống nhất xác thực người dùng cho các dịch vụ web khác nhau nằm trên các tên miền phụ khác nhau. Ví dụ: trên trang chính và trên diễn đàn của trang. Để tránh việc gửi cookie không được kiểm soát, giá trị không được chỉ chứa tên vùng (ví dụ: .com, .net.ru, v.v.).
  • Thuộc tính đường dẫn. Được chỉ định ở định dạng path= . Xác định một tập hợp các URL mà cookie được đặt là hợp lệ. Ví dụ: nếu giá trị khi đặt cookie là /temp thì cookie đã đặt sẽ được gửi khi yêu cầu tài liệu, bao gồm các đường dẫn /temp000 và /temp/temp.htm. Nếu giá trị đường dẫn không được chỉ định, nó sẽ được coi là đường dẫn đến tài nguyên theo yêu cầu mà cookie đã được đặt.
  • Thuộc tính an toàn. Đây là thuộc tính Boolean. Việc chỉ định thuộc tính bảo mật trong trường Set-Cookie của tiêu đề phản hồi HTTP của máy chủ sẽ giúp cookie được đặt an toàn. Những cookie như vậy chỉ nên được gửi đến máy chủ bởi giao thức https. HTTPS thực tế giống nhau giao thức http, chỉ dữ liệu giữa máy khách và máy chủ được truyền qua kết nối SSL (Lớp cổng bảo mật) an toàn (dữ liệu được mã hóa).
  • Thuộc tính HttpOnly. Đây là thuộc tính Boolean. Việc chỉ định thuộc tính HttpOnly trong trường Set-Cookie của tiêu đề phản hồi HTTP của máy chủ khiến tập lệnh máy khách không thể truy cập được tập lệnh máy khách (điều này là vì lý do bảo mật).
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
 jQuery.cookie = hàm() (
var url = location.href ; // đường dẫn cài đặt cookie
.cookieID = "cookie" này; // tên cho biến sẽ chứa cookie của chúng tôi

this .set = function (options) ( // Hàm thiết lập cookie
var cookieContent = "" ; // khởi tạo biến cho vòng lặp for
var filterProperties = ("cookieID" : 0 , "set" : 1 , "get" : 2 ) ; // tạo một đối tượng với các giá trị đã biết
tùy chọn = tùy chọn || ( ) ; // nếu biến người dùng được truyền, hãy sử dụng chúng. Chúng tôi không cài đặt bất cứ thứ gì theo mặc định.

for (thuộc tính var trong this ) ( // lặp qua tất cả các phần tử của đối tượng kết quả
if (! (thuộc tính trong filterProperties) ) ( // lấy ra tất cả các phần tử ngoại trừ những phần tử có trong filterProperties
if (thuộc tính [thuộc tính này] === null ) thuộc tính [thuộc tính này] = "" ; // nếu bằng 0, thay thế bằng ""
cookieContent += (thuộc tính) + "> + (thuộc tính [thuộc tính này] ) + "," ; // ghi tên biến + giá trị biến
}
}
cookieContent = cookieContent.substring ( 0 , cookieContent.length - 1 ); // xóa dấu phẩy cuối cùng
var hết hạn = ""; // khởi tạo biến
if (options.expires && (typeof options.expires == "number" || options.expires .toUTCString ) ) ( // nếu chúng ta có bất kỳ giá trị nào thì
ngày var; // tạo một biến cho ngày tháng
if (typeof options.expires == "number" ) ( // nếu đây là số
ngày = Ngày mới(); // ngay hiện tại
date.setTime(date.getTime() + (options.expires * 24 * 60 * 60 * 1000) ); // đặt thời gian
) khác (
ngày = tùy chọn.hết hạn; // giá trị trống; cookie sẽ được lưu trữ cho đến khi kết thúc phiên
}
hết hạn= "; hết hạn=" + date.toUTCString () ; // thiết lập thời gian tồn tại của cookie
}
đường dẫn var = options.path ? "; path=" + (options.path ) : "" ; // đặt url mà cookie đã cài đặt hợp lệ
tên miền var = tùy chọn.domain? "; tên miền=" + (options.domain ) : "" ; // thiết lập nhiệm vụ của trang web
var safe = options.secure ? "; chắc chắn" : "" ; // cho biết dữ liệu có nên được mã hóa hay không
document.cookie = [ this .cookieID , "=" , EncodeURIComponent(cookieContent) , hết hạn, đường dẫn, tên miền, bảo mật] .join ("" ) ; // tạo một chuỗi từ mảng và ghi nó vào cookie
trả về đúng ;
} ;

cái này .get = function () ( // hàm lấy cookie
var cookieValue = "" ;
if (document.cookie && document.cookie != "" ) ( // nếu cookie có sẵn và tồn tại
var cookies = document.cookie .split (";" ); // tách và lấy một mảng
với (var i = 0 ; i< cookies.length ; i++ ) { // выполняем перебор массива
var cookie = jQuery.trim (cookie[i] ); // đã cắt bớt tất cả phần đệm
if (cookie.substring (0 , this .cookieID .length + 1 ) == (this .cookieID + "=" ) ) ( // tìm từ cookie
cookieValue = giải mãURIComponent(cookie.substring (.cookieID .length + 1 này) ); // lấy ra tất cả các giá trị
phá vỡ ;
}
}
var Properties = cookieValue.split ("," ) ; // chia tất cả các giá trị thành một mảng
với (var i = 0 ; i< properties.length ; i++ ) { // перебрали массив
var property = Properties[ i].split (://; ) ; // chia từng phần tử và
cái này [ thuộc tính [ 0 ] ] = thuộc tính [ 1 ] ; // thêm thuộc tính vào đối tượng
}

}
trả về đúng ;
} ;
trả lại cái này;
} ;

HTML sẽ trông như thế này:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56

=< value> [ ; < name>=< value> ] ...
[ ; hết hạn=< date>] [ ; tên miền=< domain_name> ]
[ ; đường dẫn=< some_path>] [ ; chắc chắn][; httponly]

Có thể thấy, dòng Set-Cookie của tiêu đề phản hồi của máy chủ bao gồm một chuỗi các chuỗi con được phân tách bằng ký tự ";" (dấu chấm phẩy). Một hoặc nhiều = cặp theo sau trước. Mỗi cặp này tương ứng với một cookie có tên tên và giá trị giá trị. Sau đó làm theo các thuộc tính mà cookie chứa trong trường Set-Cookie này được đặt. Sau đây là mô tả về các giá trị thuộc tính cookie.

  • Thuộc tính hết hạn. Được chỉ định ở định dạng: Expires= . Xác định ngày và giờ hết hạn do trường Set-Cookie này đặt trong tiêu đề phản hồi HTTP của máy chủ cookie. Giá trị phải là một chuỗi chỉ định Giờ Kinh tuyến Greenwich (GMT) ở định dạng "DAY, DD-MMM-YYYY HH:MM:SS GMT" (ví dụ: "Thứ Ba, ngày 28 tháng 2 năm 2006 12:41:04 GMT") . Khi cookie hết hạn, nó sẽ bị trình duyệt xóa. Nếu thuộc tính hết hạn không được đặt (ngày hết hạn của cookie không được đặt), cookie sẽ bị xóa khi trình duyệt thoát. Những cookie này được gọi là cookie “phiên” (chúng chỉ có hiệu lực cho đến khi kết thúc phiên hiện tại).
  • thuộc tính miền. Được chỉ định ở định dạng domain= . Chỉ định phần cuối của tập hợp tên miền trong đó cookie được đặt là hợp lệ. Ví dụ: nếu khi đặt cookie, giá trị là .codeguru.ru, các cookie đã cài đặt sẽ được gửi đến máy chủ khi yêu cầu tài liệu từ các trang web nằm trên các miền web.codeguru.ru, forum.codeguru.ru, v.v. Trong trường hợp này, điều kiện bổ sung để gửi cookie sẽ là kiểm tra giá trị của thuộc tính đường dẫn - xem bên dưới. Thuộc tính miền khá hữu ích. Ví dụ, nó có thể được sử dụng để tổ chức một hệ thống xác thực người dùng thống nhất cho các dịch vụ web khác nhau nằm trên các tên miền phụ khác nhau. Ví dụ: trên trang chính và trên diễn đàn của trang. Để tránh việc gửi cookie không được kiểm soát, giá trị không được chỉ chứa tên vùng (ví dụ: .com, .net.ru, v.v.).
  • Thuộc tính đường dẫn. Được chỉ định ở định dạng path= . Xác định một tập hợp các URL mà cookie được đặt là hợp lệ. Ví dụ: nếu giá trị khi đặt cookie là /temp thì cookie đã đặt sẽ được gửi khi yêu cầu tài liệu, bao gồm các đường dẫn /temp000 và /temp/temp.htm. Nếu giá trị đường dẫn không được chỉ định, nó sẽ được coi là đường dẫn đến tài nguyên theo yêu cầu mà cookie đã được đặt.
  • Thuộc tính an toàn. Đây là thuộc tính Boolean. Việc chỉ định thuộc tính bảo mật trong trường Set-Cookie của tiêu đề phản hồi HTTP của máy chủ sẽ giúp cookie được đặt an toàn. Những cookie như vậy phải được gửi đến máy chủ chỉ bằng giao thức https. HTTPS thực tế là giao thức giống như http, chỉ có dữ liệu giữa máy khách và máy chủ được truyền qua kết nối SSL (Lớp cổng bảo mật) an toàn (dữ liệu được mã hóa).
  • Thuộc tính HttpOnly. Đây là thuộc tính Boolean. Việc chỉ định thuộc tính HttpOnly trong trường Set-Cookie của tiêu đề phản hồi HTTP của máy chủ khiến tập lệnh máy khách không thể truy cập được tập lệnh máy khách (điều này là vì lý do bảo mật).
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
 jQuery.cookie = hàm() (
var url = location.href ; // đường dẫn cài đặt cookie
.cookieID = "cookie" này; // tên cho biến sẽ chứa cookie của chúng tôi

this .set = function (options) ( // Hàm thiết lập cookie
var cookieContent = "" ; // khởi tạo biến cho vòng lặp for
var filterProperties = ("cookieID" : 0 , "set" : 1 , "get" : 2 ) ; // tạo một đối tượng với các giá trị đã biết
tùy chọn = tùy chọn || ( ) ; // nếu biến người dùng được truyền, hãy sử dụng chúng. Chúng tôi không cài đặt bất cứ thứ gì theo mặc định.

for (thuộc tính var trong this ) ( // lặp qua tất cả các phần tử của đối tượng kết quả
if (! (thuộc tính trong filterProperties) ) ( // lấy ra tất cả các phần tử ngoại trừ những phần tử có trong filterProperties
if (thuộc tính [thuộc tính này] === null ) thuộc tính [thuộc tính này] = "" ; // nếu bằng 0, thay thế bằng ""
cookieContent += (thuộc tính) + "> + (thuộc tính [thuộc tính này] ) + "," ; // ghi tên biến + giá trị biến
}
}
cookieContent = cookieContent.substring ( 0 , cookieContent.length - 1 ); // xóa dấu phẩy cuối cùng
var hết hạn = ""; // khởi tạo biến
if (options.expires && (typeof options.expires == "number" || options.expires .toUTCString ) ) ( // nếu chúng ta có bất kỳ giá trị nào thì
ngày var; // tạo một biến cho ngày tháng
if (typeof options.expires == "number" ) ( // nếu đây là số
ngày = Ngày mới(); // ngay hiện tại
date.setTime(date.getTime() + (options.expires * 24 * 60 * 60 * 1000) ); // đặt thời gian
) khác (
ngày = tùy chọn.hết hạn; // giá trị trống; cookie sẽ được lưu trữ cho đến khi kết thúc phiên
}
hết hạn= "; hết hạn=" + date.toUTCString () ; // thiết lập thời gian tồn tại của cookie
}
đường dẫn var = options.path ? "; path=" + (options.path ) : "" ; // đặt url mà cookie đã cài đặt hợp lệ
tên miền var = tùy chọn.domain? "; tên miền=" + (options.domain ) : "" ; // thiết lập nhiệm vụ của trang web
var safe = options.secure ? "; chắc chắn" : "" ; // cho biết dữ liệu có nên được mã hóa hay không
document.cookie = [ this .cookieID , "=" , EncodeURIComponent(cookieContent) , hết hạn, đường dẫn, tên miền, bảo mật] .join ("" ) ; // tạo một chuỗi từ mảng và ghi nó vào cookie
trả về đúng ;
} ;

cái này .get = function () ( // hàm lấy cookie
var cookieValue = "" ;
if (document.cookie && document.cookie != "" ) ( // nếu cookie có sẵn và tồn tại
var cookies = document.cookie .split (";" ); // tách và lấy một mảng
với (var i = 0 ; i< cookies.length ; i++ ) { // выполняем перебор массива
var cookie = jQuery.trim (cookie[i] ); // đã cắt bớt tất cả phần đệm
if (cookie.substring (0 , this .cookieID .length + 1 ) == (this .cookieID + "=" ) ) ( // tìm từ cookie
cookieValue = giải mãURIComponent(cookie.substring (.cookieID .length + 1 này) ); // lấy ra tất cả các giá trị
phá vỡ ;
}
}
var Properties = cookieValue.split ("," ) ; // chia tất cả các giá trị thành một mảng
với (var i = 0 ; i< properties.length ; i++ ) { // перебрали массив
var property = Properties[ i].split (://; ) ; // chia từng phần tử và
cái này [ thuộc tính [ 0 ] ] = thuộc tính [ 1 ] ; // thêm thuộc tính vào đối tượng
}

}
trả về đúng ;
} ;
trả lại cái này;
} ;

HTML sẽ trông như thế này:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56

Để thuận tiện, giá trị cookie có thể được đặt thông qua một biến:

2. Nhận Cookie

Để nhận cookie, bạn cần sử dụng:

$_COOKIE["cookie_name"];

Để loại bỏ lỗi do có thể thiếu cookie, hãy sử dụng:

Như trong ví dụ trước về làm việc với Cookie trong jQuery, cookie có thể được gán cho một biến:

3. Xóa cookie

Xóa cookie trong PHP cũng dễ dàng như trong jQuery. Tất cả những gì bạn phải làm là đặt cookie thành giá trị trống và thời gian âm (thời gian đã trôi qua):

Setcookie("cookie_name", "", time() - 3600);

Thời gian trong trong ví dụ này bằng một giờ trước, đủ để xóa cookie.

Tôi muốn lưu ý rằng trong một số trường hợp việc sử dụng cookie sử dụng hợp lý hơn cơ sở dữ liệu để thực hiện các chức năng cần thiết.