Javascript Localstorage ve SessionStorage

Javascript Localstorage ve SessionStorage , web tarayıcılarındaki verileri saklamak için iki önemli yerleşik özellik sunar: LocalStorage ve SessionStorage. Her iki özellik de tarayıcının belleğinde veri saklamak için kullanılmakta olup. Aralarındaki temel fark, verilerin ne kadar süreyle saklandığıdır.

LocalStorage, verilerin tarayıcı kapatılana kadar saklandığı bir depolama alanıdır. Örneğin, bir kullanıcı bir web sitesine girdiğinde kullanıcı adı ve şifresini girdiğinde, bu bilgiler LocalStorage’da saklanabilir.Kullanıcı tarayıcıyı kapattıktan sonra tekrar açtığında bu bilgilerin hala mevcut olduğunu göreceksiniz.

Aşağıdaki örnek kod, LocalStorage’a veri kaydetmeyi gösterir:

localStorage.setItem("username", "JohnDoe");
localStorage.setItem("password", "password123");

Bu kod, “username” ve “password” anahtarlarına değerleri “JohnDoe” ve “password123” olarak kaydeder. Bu verileri almak için aşağıdaki kod kullanabilirsiniz.:

var username = localStorage.getItem("username");
var password = localStorage.getItem("password");

SessionStorage, LocalStorage’a benzer şekilde tarayıcıda veri saklamak için kullanılır, ancak veriler sadece o anda açık olan sekme için geçerlidir.

Örneğin, bir kullanıcı bir web sayfasına girdiğinde kullanıcı adı ve şifresini girdiğinde, bu bilgiler SessionStorage’da saklanır, ancak kullanıcı o sekmeyi kapattığında bu bilgiler kaybolur. Aşağıdaki kod, SessionStorage’a veri kaydetmeyi gösterir:

sessionStorage.setItem("username", "JohnDoe");
sessionStorage.setItem("password", "password123");

Bu kod, “username” ve “password” anahtarlarına değerleri “JohnDoe” ve “password123” olarak kaydeder. Bu verileri almak için aşağıdaki kod kullanılabilirs:

var username = sessionStorage.getItem("username");
var password = sessionStorage.getItem("password");

Sonuç olarak, LocalStorage ve SessionStorage,JavaScript ile web tarayıcılarında veri saklamak için kullanılabilecek iki yerleşik özellik olarak sunulmakta. LocalStorage, verilerin tarayıcı kapatılana kadar saklandığı bir depolama alanıdır, bu sayede kullanıcılar tarayıcılarını kapattıktan sonra bile bilgilerini hatırlamış olurlar. SessionStorage ise, verilerin sadece o anda açık olan sekme için geçerli olduğu bir depolama alanıdır. Bu sayede, web sayfasını kapattığında veriler kaybolur. Bu makalede, LocalStorage ve SessionStorage’ın nasıl kullanılabileceği örnek kodlar ve açıklamalarla gösterilmiştir.

JavaScript LocalStorage ve SessionStorage gibi veri saklama yöntemleri, web uygulamaları için kullanışlıdır. Ancak güvenlik açısından bazı noktalara dikkat edilmesi gerekir. Özellikle, bu yöntemlerle saklanan verilerin şifresiz olarak saklandığını unutmamak önemlidir. bu nedenle, güvenli bir şekilde saklamak için verileri şifrelemek gerekir.

Ayrıca, LocalStorage ve SessionStorage, verileri tarayıcının belleğinde saklar, bu nedenle, bir kullanıcının tarayıcının belleğini okuyabileceği veya verileri değiştirebileceği ihtimali vardır. Bu nedenle, bu yöntemlerle saklanan verilerin önemli olmadığı veya gizli olmayan veriler olması öneriyorum.

bu verileri silmek için aşağıdaki kodlar işinize yarayacaktır.:

localStorage.removeItem("username");
sessionStorage.removeItem("password");

Son olarak, bu güvenli bir şekilde kullanılmadığı takdirde güvenlik açısından risk oluşturur.

localstorage alanından kaydedilen bütün verileri nasıl sileriz ?

JavaScript LocalStorage alanından kaydedilen tüm verileri silmek için, localStorage.clear() metodunu kullanabilirsiniz. Bu metod, LocalStorage alanındaki tüm verileri siler ve tarayıcının belleğinden tamamen kaldırır. Örnek olarak:

localStorage.clear();

Bu kod, LocalStorage alanındaki tüm verileri siler ve tarayıcının belleğinden tamamen kaldırır. Bu yöntemle, kaydedilen tüm verileri tek seferde silebilirsiniz. Eğer yalnızca belirli verileri silmek istiyorsanız, localStorage.removeItem(key) metodunu kullanabilirsiniz, key değişkeni silmek istediğiniz verinin anahtarıdır. Örnek:

localStorage.removeItem("username");

localStorage.setItem("username", "JaneDoe");

var oldUsername = localStorage.getItem("username");
localStorage.setItem("username", "JaneDoe");
console.log(oldUsername);

1. MDN Web Docs – LocalStorage: https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage
2. MDN Web Docs – SessionStorage: https://developer.mozilla.org/en-US/docs/Web/API/Window/sessionStorage