SessionStorage được lưu trữ ở đâu?

Trong thời gian dài nhất, cookie là cách duy nhất để duy trì trạng thái. Sau đó, HTML5 đến. HTML5 cung cấp thêm hai cách lưu trữ dữ liệu trên trình duyệt - localStorage và sessionStorage

localStorage lưu trữ dữ liệu không có ngày hết hạn. Điều đó có nghĩa là dữ liệu sẽ không bị xóa khi đóng trình duyệt và dữ liệu sẽ có sẵn vào ngày hôm sau, tuần sau hoặc thậm chí là năm sau

Trong trình duyệt chrome, chúng ta có thể xem nội dung của localStorage bằng cách mở Developer tools > Application > Local Storage

Cài đặt, truy xuất và xóa dữ liệu khỏi localStorage khá dễ dàng

1localStorage.setItem["favoriteColor", "black"];
2localStorage.favoriteColor;
3localStorage.removeItem["favoriteColor"];
Bản sao
localStorage cung cấp ít nhất 5 MB dung lượng lưu trữ dữ liệu trên tất cả các trình duyệt web chính. Con số này lớn hơn rất nhiều so với 4KB [kích thước tối đa] mà chúng tôi có thể lưu trữ trong cookie
dữ liệu localStorage có thể được đọc bởi bất kỳ mã JavaScript nào. Nếu tin tặc có thể thực thi mã JavaScript trên ứng dụng web của chúng tôi thì tin tặc sẽ có thể đánh cắp tất cả dữ liệu được lưu trữ trong localStorage
Dữ liệu được lưu trữ trong sessionStorage sẽ bị xóa khi phiên trang kết thúc. Một phiên trang kéo dài miễn là trình duyệt được mở và tồn tại qua các lần tải lại và khôi phục trang. Đóng tab/cửa sổ sẽ kết thúc phiên và xóa các đối tượng trong sessionStorage
1// Save data to sessionStorage
2sessionStorage.setItem["key", "value"];
3
4// Get saved data from sessionStorage
5let data = sessionStorage.getItem["key"];
6
7// Remove saved data from sessionStorage
8sessionStorage.removeItem["key"];
9
10// Remove all saved data from sessionStorage
11sessionStorage.clear[];
Bản sao
Không có gì để cam kết trong chương này vì tất cả những gì chúng ta đã làm là tìm hiểu những điều cơ bản về localStorage và sessionStorage

  

 
Nếu bạn là nhà phát triển web, thì có lẽ bạn đã nghe nói về lưu trữ cục bộ và lưu trữ phiên. Nhưng chính xác thì chúng là gì? 
API lưu trữ web
Trước HTML5, các nhà phát triển chỉ phải dựa vào cookie để lưu trữ dữ liệu ở phía máy khách. Tuy nhiên, khi HTML5 được giới thiệu, các nhà phát triển đã được cung cấp tùy chọn sử dụng API mới có tên là Lưu trữ web. API này cung cấp hai loại lưu trữ khác nhau. lưu trữ cục bộ và lưu trữ phiên. Lưu trữ cục bộ và lưu trữ phiên cho phép các ứng dụng web lưu trữ dữ liệu cục bộ trên trình duyệt của người dùng
Lưu trữ phiên
Lưu trữ phiên là một loại lưu trữ web cho phép dữ liệu được lưu trữ ở phía máy khách chỉ trong khoảng thời gian của phiên hiện tại. Khi người dùng đóng trình duyệt của họ, tất cả dữ liệu đã được lưu trữ trong bộ lưu trữ phiên sẽ bị xóa
Lưu trữ phiên hữu ích để lưu trữ dữ liệu tạm thời không cần phải duy trì trong các phiên, chẳng hạn như ID phiên hoặc dữ liệu tạm thời chỉ được sử dụng trong khoảng thời gian của phiên hiện tại
Đặt dữ liệu trong bộ nhớ phiên
Để đặt dữ liệu trong bộ nhớ phiên, bạn có thể sử dụng phương pháp 
1// Save data to sessionStorage
2sessionStorage.setItem["key", "value"];
3
4// Get saved data from sessionStorage
5let data = sessionStorage.getItem["key"];
6
7// Remove saved data from sessionStorage
8sessionStorage.removeItem["key"];
9
10// Remove all saved data from sessionStorage
11sessionStorage.clear[];
0. Phương thức này chấp nhận hai đối số
Khóa, là một chuỗi sẽ được sử dụng để xác định dữ liệu
Giá trị, là dữ liệu được lưu trữ
Ví dụ: để đặt biến phiên có tên user_id với giá trị là 1234, bạn sẽ thực hiện như sau
sessionStorage.setItem[‘user_id’, ‘1234’];
Lấy dữ liệu từ lưu trữ phiên
Để truy xuất dữ liệu từ bộ lưu trữ phiên, bạn có thể sử dụng phương pháp 
1// Save data to sessionStorage
2sessionStorage.setItem["key", "value"];
3
4// Get saved data from sessionStorage
5let data = sessionStorage.getItem["key"];
6
7// Remove saved data from sessionStorage
8sessionStorage.removeItem["key"];
9
10// Remove all saved data from sessionStorage
11sessionStorage.clear[];
1. Phương thức này chấp nhận một đối số duy nhất, đó là khóa của dữ liệu mà bạn muốn truy xuất. Ví dụ: để lấy giá trị của biến phiên user_id, bạn sẽ làm như sau
let user_id = sessionStorage.getItem[‘user_id’]; // 1234
Xóa dữ liệu khỏi bộ nhớ phiên
Để xóa dữ liệu khỏi bộ nhớ phiên, bạn có thể sử dụng phương pháp 
1// Save data to sessionStorage
2sessionStorage.setItem["key", "value"];
3
4// Get saved data from sessionStorage
5let data = sessionStorage.getItem["key"];
6
7// Remove saved data from sessionStorage
8sessionStorage.removeItem["key"];
9
10// Remove all saved data from sessionStorage
11sessionStorage.clear[];
2. Phương thức này chấp nhận một đối số duy nhất, đó là khóa của dữ liệu mà bạn muốn xóa. Để xóa biến phiên user_id, bạn sẽ làm như sau

  

sessionStorage.removeItem[‘user_id’];
Ảnh của ThisisEngineering RAEng trên Bapt
Lưu trữ cục bộ
Lưu trữ cục bộ là một loại lưu trữ web cho phép dữ liệu được lưu trữ ở phía máy khách vô thời hạn. Không giống như bộ nhớ phiên, dữ liệu được lưu trữ trong bộ nhớ cục bộ vẫn còn ngay cả sau khi đóng trình duyệt
Bộ nhớ cục bộ hữu ích để lưu trữ dữ liệu cần được duy trì trong các phiên, chẳng hạn như tùy chọn hoặc cài đặt của người dùng
Đặt dữ liệu trong bộ nhớ cục bộ
Để đặt dữ liệu trong bộ nhớ cục bộ, bạn cũng có thể sử dụng phương pháp 
1// Save data to sessionStorage
2sessionStorage.setItem["key", "value"];
3
4// Get saved data from sessionStorage
5let data = sessionStorage.getItem["key"];
6
7// Remove saved data from sessionStorage
8sessionStorage.removeItem["key"];
9
10// Remove all saved data from sessionStorage
11sessionStorage.clear[];
0. Phương thức này chấp nhận hai đối số giống nhau
Khóa, là một chuỗi sẽ được sử dụng để xác định dữ liệu
Giá trị, là dữ liệu được lưu trữ
Sử dụng cùng một ví dụ, chúng ta có thể đặt biến cục bộ có tên user_id thành giá trị 1234
localStorage.setItem[‘user_id’, ‘1234’];
Truy xuất dữ liệu từ bộ nhớ cục bộ
Để truy xuất dữ liệu từ bộ nhớ cục bộ, bạn cũng có thể sử dụng phương pháp 
1// Save data to sessionStorage
2sessionStorage.setItem["key", "value"];
3
4// Get saved data from sessionStorage
5let data = sessionStorage.getItem["key"];
6
7// Remove saved data from sessionStorage
8sessionStorage.removeItem["key"];
9
10// Remove all saved data from sessionStorage
11sessionStorage.clear[];
1. Phương thức này chấp nhận cùng một đối số duy nhất, đó là khóa của dữ liệu mà bạn muốn truy xuất

  

let user_id = localStorage.getItem[‘user_id’]; // 1234
Xóa dữ liệu khỏi bộ nhớ cục bộ
Để xóa tất cả dữ liệu khỏi bộ nhớ cục bộ, bạn có thể sử dụng phương pháp 
let user_id = sessionStorage.getItem[‘user_id’]; // 1234
2. Phương pháp này không chấp nhận bất kỳ đối số
________số 8
Để xóa một mục cụ thể khỏi bộ nhớ cục bộ, bạn có thể sử dụng phương pháp 
1// Save data to sessionStorage
2sessionStorage.setItem["key", "value"];
3
4// Get saved data from sessionStorage
5let data = sessionStorage.getItem["key"];
6
7// Remove saved data from sessionStorage
8sessionStorage.removeItem["key"];
9
10// Remove all saved data from sessionStorage
11sessionStorage.clear[];
2. Phương thức này chấp nhận một đối số duy nhất, đó là khóa của dữ liệu mà bạn muốn xóa
localStorage.removeItem[‘user_id’];
Bộ nhớ cục bộ so với Bộ nhớ phiên
Bây giờ chúng tôi đã đề cập đến những điều cơ bản về lưu trữ cục bộ và lưu trữ phiên, hãy thảo luận về sự khác biệt giữa hai
Sự khác biệt chính giữa bộ nhớ cục bộ và bộ nhớ phiên là dữ liệu được lưu trữ trong bộ nhớ cục bộ vẫn tồn tại ngay cả sau khi đóng trình duyệt, trong khi dữ liệu được lưu trữ trong bộ nhớ phiên chỉ khả dụng trong khoảng thời gian của phiên hiện tại
Một điểm khác biệt nữa là bộ nhớ cục bộ không dựa trên phiên, nghĩa là dữ liệu bên trong bộ nhớ cục bộ phải được xóa thủ công. Cuối cùng, dung lượng lưu trữ của bộ nhớ cục bộ cũng lớn hơn dung lượng lưu trữ phiên
Bộ nhớ cục bộ được sử dụng tốt nhất cho dữ liệu cần được duy trì trong các phiên, chẳng hạn như tùy chọn hoặc cài đặt của người dùng. Lưu trữ phiên phù hợp hơn với dữ liệu tạm thời không cần lưu sau khi phiên kết thúc
Tôi hy vọng bài viết này sẽ giải tỏa mọi nhầm lẫn mà bạn gặp phải. Chúc may mắn với các dự án mã hóa của bạn
Thêm nội dung tại PlainEnglish. io. Đăng ký nhận bản tin hàng tuần miễn phí của chúng tôi. Theo dõi chúng tôi trên Twitter và LinkedIn. Kiểm tra Sự bất hòa trong cộng đồng của chúng tôi và tham gia Tập thể tài năng của chúng tôi
 

			
Lưu trữ phiên có được lưu trữ trên máy chủ không?
			
Nó không được lưu trữ trên máy chủ , vì chúng tôi vẫn ở phía máy khách khi bạn đang nói về Cửa sổ. phiênStorage. Nó được lưu trữ trong một tệp có tên "sessionstore. jsonlz4". 
		
			
Bộ nhớ phiên có cục bộ không?
			
Sự khác biệt giữa sessionStorage và localStorage là  dữ liệu localStorage không hết hạn, trong khi dữ liệu sessionStorage bị xóa khi phiên trang kết thúc . Phiên trang duy nhất được tạo sau khi tài liệu được tải trong tab trình duyệt. Phiên trang chỉ hợp lệ cho một tab tại một thời điểm.