Bài 19: Cookie trong javascript

Như mình đã nói DOM là con của BOM, và trong DOM cũng chứa rất nhiều các thuộc tính, phương thức khác có thể tác động trang web và bài hôm nay chúng ta sẽ tìm hiểu về cookie trong DOM(hay bao quát hơn là trong BOM).

1, Cookie là gì?

-Cookie là một file dữ liệu được lưu trữ ở mỗi máy của client và đối với mỗi trình duyệt nó sẽ lưu ở mỗi một ổ khác nhau, còn về thời gian sống của cookie có thể là vĩnh viễn hoặc cũng có thể là một thời gian nhất định (do chúng ta thiết lập).

VD: Cookie của chorme.

-Vì cookie lưu ở máy của client, nên khi chúng ta tắt trình duyệt đi thì cookie vẫn tồn tại nếu như khoảng thời gian sống của nó vẫn còn, điều này khác so với session. Tuy nhiên vì cookie được lưu trữ ở client nên chúng ta cần phải cân nhắc kỹ trước khi sử dụng nó(bảo mật).

2, Cookie trong javascript.

Tạo cookie

-Để tạo cookie trong javascript chúng ta sử dụng cú pháp sau:

window.document.cookie = 'option';
//hoặc
document.cookie = 'option';

Trong đó: option là các thông số cấu hình của cookie như tên, thời gian sống,…

VD: Tạo cookie có tên là name và có giá trị là ‘VuThanhTai‘.

document.cookie = 'name=VuThanhTai';

VD: Tạo cookie kèm với thời gian sống expires.

document.cookie = 'name=vuthanhtai; expires=Thu, 22 Dec 2017 19:55:20 UTC';

VD: Tạo cookie kèm kèm theo path.

document.cookie = 'name=vuthanhtai; expires=Thu, 22 Dec 2017 19:55:20 UTC;path=/';

Đọc cookie.

-Để đọc cookie thì các bạn chỉ cần sử dụng cú pháp:

var data = document.cookie;

-Khi đó tất cả các cookie hiện có sẽ được trả về biến data dưới dạng string và mỗi cookie sẽ cách nhau bởi một dấu ;.

Thay đổi giá trị của cookie

-Để thay đổi cookie thực ra chỉ là các bạn tạo mới một cookie có cùng name với cookie các bạn muốn thay đổi.

VD: Mình sẽ thay đổi cookie giá trị của cookie name thành toidicode.com.

document.cookie = 'name=toidicode.com; expires=Thu, 22 Dec 2017 19:55:20 UTC';

Xóa cookie

-Để xóa cookie thì các bạn cũng sử dụng thủ thuật giống mình đã từng làm trong PHP là set cho thời gian sống của nó nhỏ hơn thời gian hiện tại.

VD: Mình sẽ xóa cookie name ở trên bằng cách cho thông số expires về nhỏ hơn thời gian hiện tại.

document.cookie = 'name=toidicode.com; expires=Thu, 22 Dec 1990 19:55:20 UTC';

3, Lời kết.

-Như vậy mình đã giới thiệu xong đến mọi người cơ bản về cookie trong javascript rồi, nếu như các bạn muốn tìm hiểu nâng cao hơn thì có thể tham khảo link.