Xin hãy ngừng dùng local storage.
Tôi không biết chính xác nó là cái gì mà làm cho bao nhiêu developer phát cuồng và lưu trữ session information trong local storage, nhưng dù gi đi nữa: việc này cần phải ngừng lại. Mọi thứ đang dần ngoài tầm kiển soát. Gần như ngày nào tôi cũng tình cờ thấy một website mới chứa thông ...
Tôi không biết chính xác nó là cái gì mà làm cho bao nhiêu developer phát cuồng và lưu trữ session information trong local storage, nhưng dù gi đi nữa: việc này cần phải ngừng lại. Mọi thứ đang dần ngoài tầm kiển soát.
Gần như ngày nào tôi cũng tình cờ thấy một website mới chứa thông tin nhạy cảm của user trong local storage và tôi cảm thấy rất bối rối khi có quá nhiều developer đang dần gửi gắm hết lên đó.
Hãy cùng ngồi lại, nói về local storage và tại sao bạn nên ngừng sử dụng nó đi.
Local Storage là gì?
Có lẽ với một số người cũng chưa biết local storage là gì nữa. Hãy bắt đầu từ cái căn bản: local storage là một feature mới của HTML5 cho phép bạn lưu trữ bất kì info nào bạn muốn trong browser dùng JavaScript. Nó rất là đơn giản.
Thực tế thì local storage chỉ là một object JavaScript bự và cũ kĩ cho phép bạn attach data (hoặc remove cũng được). Đây là một ví dụ của một vài JavaScript code lưu trữ một vài thông tin cá nhân trong local storage:
1 2 3 4 5 6 7 8 9 |
// Bạn có thể store local storage sử dụng syntax localStorage.userName = "TopDev"; localStorage.setItem("favoriteColor", "Red"); // Một khi dữ liệu ở trong Local Storage, nó sẽ ở đó mãi mãi cho đến khi nó được // explicitly removed alert(localStorage.userName + " Thích màu " + localStorage.favoriteColor + "."); |
Nếu bạn chạy code JavaScript này trong browser trên trang HTML test, bạn sẽ test phrase “TopDev thích màu đỏ” trong alert message. Nếu bạn sử dụng các tool developer của mình, bạn sẽ thấy cả hai biến userName và favoriteColor đều được lưu trữ trong local storage trong browser.
Có thể bạn sẽ thắc mắc liệu có có cách nào data bạn lưu trữ một lúc nào đó tự động xóa và bạn không cần phải xóa từng cái thủ công mỗi biến bạn để vào không. May mắn thay HTML5 working group thêm sessionStorage vào HTML5 hoạt động đúng y như local storage trừ một điểm là tất cả data lưu trữ sẽ tự động xóa đi khi user đóng tab browser lại.
Local Storage có gì lạ?
Sau khi hiểu về local storage, chúng ta sẽ bàn về những gì đặc sắc của nó. Mặc dù bài viết này nhằm mục đích thuyết phục bạn từ bỏ local storage, tôi vẫn thừa nhận là nó cũng có vài điểm thú vị.
Đầu tiên: nó là JavaScript thuần! Một trong những thứ gây ức chế nhất về cookies (đặc trưng khác của local storage) đó là nó cần được tạo bởi web server. Nếu bạn đang build một static site (ví dụ như một app đơn trang), việc dùng local storage đồng nghĩa là các web page của bạn có thể chạy độc lập với bất kì web server nào. Chúng không cần ngôn ngữ backend hay logic nào để lưu data trong browser: chúng có thể làm nếu muốn.
Đây là một concept táo bạo và là một trong những lí do chính mà local storage trở nên hot như thế trong giới lập trình.
Một thứ khác tuyệt vời về local storage đó là nó không có nhiều size constraint như cookies. Local storage cung cấp ít nhất 5MB data storage qua tất cả các web browser, hơn nhiều so với cookie (maximum 4KB).
Chính điều này làm cho local storage trở nên hữu ích nếu bạn cache một số app data trong browser để dùng sau. Vì 4kB là không nhiều, local storage là một trong những option thay thế duy nhất.
Local Storage có gì không tốt
Chúng ta đã nói về những cái tốt, bây giờ sẽ chuyển sang cái xấu.
Local storage cực kì basic, API rất đơn giản. Tôi cảm thấy hầu hết các developer không nhận ra nó basic cỡ nào:
- Nó chỉ có thể lưu trữ string data. Nó trở nên vô dụng cho việc lưu trữ các loại data phức tạp hơn cho dù chỉ một chút. Và chắc chắn rằng, bạn có thể nhận ra mọi thứ bao gồm các loại data trong local storage, nhưng là một các hack khác ugly.
- Nó có đồng bộ. Đồng nghĩa rằng với mỗi local storage operation bạn chạy sẽ chỉ được một lần một lúc.
- Các web worker không thể dùng nó. Nó có nghĩa rằng nếu bạn muốn build một app tận dụng background process để tăng hiệu suất, các chrome extension, những thứ như: bạn không thể dùng local storage vì nó không có sẵn cho các web server.
- Nó vẫn giới hạn size của data bạn có thể lưu trữ (khoảng 5MB qua các browser). Đây là một khoảng khá hạn hẹp cho những người build app mà có lượng data lớn hoặc cần phải function offline.
- Bất kì JavaScript code trên trang của bạn có thể truy cập vào local storage: nó không có cái gì để bảo về data. Một điểm trừ quá lớn về tính bảo mật.
Nói tóm lại, chỉ có duy nhất một trường hợp mà bạn cần dùng local storage: khi bạn cần các info có sẵn mà không quá nhạy cảm, không cần dùng cho các app cao cấp, không quá 5MB, và chỉ chưa string data. Phần 2 sẽ đi sâu vào các phân tích bảo mật và giải đáp cho câu hỏi: Tại sao Local Storage không an toàn và bạn không nên dùng nó để lưu trữ data nhạy cảm?
1 phút quảng cáo: TopDev đang có nhiều công ty quốc tế tuyển JS, Php để đánh global. Anh em ra biển lớn thì đừng ngại xem qua nhé. Link tại đây: https://topdev.vn/viec-lam-it
TopDev via dev.to