Yerel Depolama ve Çerezler

İstemci tarafında veri saklama stratejileri ve güvenlik.

Bölüm 01

Tarayıcı Depolama Türlerine Genel Bakış

Modern web tarayıcıları, verileri sunucuya ihtiyaç duymadan kullanıcının cihazında saklamak için çeşitli mekanizmalar sunar. Bu mekanizmalar temel olarak üç ana gruba ayrılır: Cookies (Çerezler), Local Storage ve Session Storage. Her birinin kullanım amacı, kapasitesi ve ömrü farklıdır. Çerezler internetin en eski depolama yöntemi olup genellikle sunucu-istemci iletişimi için tasarlanmıştır. Local Storage ve Session Storage ise HTML5 ile gelmiş, daha modern ve geniş kapasiteli depolama birimleridir. Veriyi istemci tarafında tutmak, sunucu yükünü azaltır, uygulamayı hızlandırır ve çevrimdışı çalışma yetenekleri kazandırır. Ancak bu verilerin kullanıcının kontrolünde olduğu ve silinebileceği unutulmamalıdır. Bu rehber boyunca, hangi verinin hangi yöntemi kullanarak saklanması gerektiğini ve bu süreçte güvenliğin nasıl sağlanacağını detaylandıracağız.

Bölüm 02

Local Storage: Kalıcı Depolama

Local Storage, tarayıcı kapatılsa bile silinmeyen "kalıcı" bir depolama birimidir. Genellikle alan adı (domain) başına 5MB ile 10MB arasında bir kapasite sunar. Veriler anahtar-değer (key-value) çiftleri şeklinde saklanır ve sadece string tipinde veri kabul eder. Eğer bir nesneyi saklamak isterseniz, önce JSON.stringify() ile metne çevirmeli, okurken ise JSON.parse() ile geri döndürmelisiniz. Local Storage, kullanıcının tema tercihlerini (gece modu), sepet bilgilerini veya tekrar eden uygulama ayarlarını saklamak için idealdir. Verilere JavaScript üzerinden localStorage.setItem(), getItem() ve removeItem() metodlarıyla çok hızlı erişilebilir. Ancak bu alanın sınırsız olmadığı ve çok fazla veri biriktirmenin tarayıcı performansını etkileyebileceği unutulmamalıdır. Ayrıca, veriler şifrelenmediği için XSS saldırılarına karşı savunmasızdır.

Bölüm 03

Session Storage: Geçici Oturumlar

Session Storage, Local Storage ile neredeyse aynı API yapısına sahiptir ancak en önemli farkı verinin "ömrüdür". Session Storage'da saklanan veriler, tarayıcı sekmesi kapatıldığı anda silinir. Sayfa yenilendiğinde veriler korunur ancak aynı sitenin başka bir sekmesinde bu verilere erişilemez. Bu özellik, tek seferlik form girişleri, bankacılık işlemleri veya sadece o oturumda geçerli olan geçici durumların (state) yönetimi için mükemmeldir. Güvenlik açısından Local Storage'dan bir adım öndedir çünkü kullanıcı sekmeyi kapattığında veriler fiziksel olarak cihazdan temizlenmiş olur. Özellikle tek sayfalı uygulamalarda (SPA), sayfa geçişlerinde state kaybetmemek ama tarayıcı kapatıldığında temizlenmesini istiyorsanız Session Storage en doğru tercihtir.

Bölüm 04

Çerezlerin (Cookies) Anatomisi

Çerezler, web depolama birimlerinden (Web Storage) farklı olarak her HTTP isteğiyle birlikte otomatik olarak sunucuya gönderilir. Bu durum çerezleri "oturum yönetimi" (session management) için vazgeçilmez kılar. Bir çerez; isim, değer, son kullanma tarihi (Expires/Max-Age), geçerli olduğu alan adı (Domain) ve yol (Path) gibi niteliklerden oluşur. Kapasitesi oldukça sınırlıdır (genellikle 4KB). Çerezler genellikle sunucu tarafından Set-Cookie header'ı ile oluşturulur ancak JavaScript üzerinden document.cookie ile de yönetilebilir. Çerezlerin en büyük dezavantajı, her istekte sunucuya gitmesi nedeniyle bant genişliğini tüketmesidir. Bu yüzden sadece sunucunun bilmesi gereken küçük kimlik doğrulama verileri için kullanılmalıdır.

Bölüm 05

Çerez Güvenliği ve Nitelikler

Çerezlerin güvenliği, modern web'in en kritik konularından biridir. HttpOnly niteliği eklenen bir çereze JavaScript üzerinden erişilemez; bu, Cross-Site Scripting (XSS) saldırılarına karşı en güçlü savunmadır. Secure niteliği ise çerezin sadece HTTPS üzerinden gönderilmesini sağlar. Ayrıca SameSite niteliği (Strict, Lax, None), çerezin üçüncü taraf sitelerden yapılan isteklere dahil edilip edilmeyeceğini belirleyerek Cross-Site Request Forgery (CSRF) saldırılarını engeller. Hassas kullanıcı verileri (session id gibi) mutlaka bu üç koruma katmanıyla birlikte sunucu tarafından ayarlanmalıdır. Güvensiz ayarlanan çerezler, tüm kullanıcı oturumunun saldırganlar tarafından ele geçirilmesine yol açabilir.

Bölüm 06

Hangi Depolamayı Seçmelisiniz?

Depolama seçimi, verinin ne amaçla kullanılacağına bağlıdır. Eğer veri sadece tarayıcıda kalacaksa (UI ayarları gibi) ve sunucuya gitmesine gerek yoksa, Web Storage (Local/Session) kullanılmalıdır. Eğer veri sunucu tarafından doğrulanması gereken bir kimlik bilgisi ise çerezler zorunludur. Performans açısından Web Storage çok daha hızlıdır çünkü ağ trafiği oluşturmaz. Kapasite olarak Web Storage MB seviyelerindeyken, çerezler KB seviyesinde kalır. Güvenlik açısından çerezler (HttpOnly ile) XSS'e karşı daha dirençlidir, ancak Web Storage'daki veriler JavaScript kodunun her yerine açıktır. Genel kural: Token'lar için Secure/HttpOnly çerezler, uygulama ayarları ve cache için Local Storage tercih edilmelidir.

Bölüm 07

Kota Yönetimi ve Hatalar

Her tarayıcının ve her depolama türünün bir sınırı vardır. Local Storage dolduğunda tarayıcı bir QuotaExceededError hatası fırlatır. Bu hatayı yönetmek için her setItem işlemini bir try/catch bloğu içine almak profesyonel bir yaklaşımdır. Ayrıca, kullanıcı tarayıcı ayarlarından depolamayı tamamen kapatmış olabilir veya "gizli sekme" modunda sınırlı yetkiler sunabilir. Bu durumları kontrol etmek için uygulamanın başında küçük bir yazma-okuma testi yapılması önerilir. Veri temizleme stratejileri geliştirmek, eski ve kullanılmayan verileri düzenli olarak silmek, kotaların aşılmasını önler. Çerezlerde ise bir domain için genellikle maksimum 20-50 çerez sınırı vardır; bu sınırı aşmak eski çerezlerin silinmesine neden olur.

Bölüm 08

IndexedDB: Tarayıcıdaki Veritabanı

Local Storage basit anahtar-değer işleri için yeterli olsa da, çok büyük veri setleri, resimler veya kompleks sorgulamalar için IndexedDB kullanılır. IndexedDB, tarayıcı içinde çalışan düşük seviyeli, döküman tabanlı asenkron bir veritabanıdır. İndeksleme desteği sayesinde binlerce veri içinde çok hızlı arama yapabilir. İşlem (Transaction) desteği sunması veri bütünlüğünü korur. Web Storage'ın aksine neredeyse sınırsız bir kapasiteye (disk alanının yüzdesi kadar) sahiptir. Kullanımı oldukça karmaşıktır ve callback yapısıyla çalışır, bu yüzden genellikle "Dexie.js" veya "idb" gibi kütüphanelerle birlikte kullanılır. Çevrimdışı (PWA) çalışan uygulamaların kalbi IndexedDB'dir.

Bölüm 09

Yasal Düzenlemeler ve Depolama

Depolama sadece teknik bir konu değil, aynı zamanda yasal bir sorumluluktur. GDPR (Avrupa) ve KVKK (Türkiye) gibi yasalar, kullanıcı verilerinin cihazlarında nasıl saklanacağını denetler. Zorunlu olmayan çerezler (reklam, takip çerezleri vb.) için kullanıcıdan açık rıza alınması şarttır. "Sitemizde çerez kullanılmaktadır" uyarısı sadece bilgilendirme değildir, kullanıcının bu çerezleri reddetme hakkı olmalıdır. Sadece sitenin çalışması için teknik olarak zorunlu olan çerezler rıza gerektirmez. Local Storage'da saklanan veriler de kişisel veri kapsamına girebilir. Bu yüzden, gereğinden fazla veri toplamamak ve verileri anonimleştirmek yasal riskleri azaltır. Gizlilik politikası dökümanınızda hangi veriyi nerede ve neden sakladığınızı açıkça belirtmelisiniz.

Bölüm 10

Hata Ayıklama ve Temizlik

Tarayıcı geliştirici araçları (F12), depolama birimlerini incelemek için gelişmiş özellikler sunar. "Application" sekmesi altında Local Storage, Session Storage ve Çerezlerin içeriğini anlık olarak görebilir, düzenleyebilir veya temizleyebilirsiniz. Geliştirme sürecinde "Storage Event" dinleyicileri kullanarak farklı sekmelerdeki depolama değişikliklerini yakalayabilirsiniz. Verilerin çakışmasını önlemek için anahtar isimlerinde "prefix" (ön ek) kullanmak (örn: app_v1_theme) iyi bir pratiktir. Ayrıca, uygulamanızın yeni versiyonlarında eski depolama şemalarını temizleyen veya güncelleyen "migration" scriptleri yazmak, kullanıcıların hatalı verilerle karşılaşmasını engeller. Depolama temizliği, hem kullanıcı gizliliği hem de uygulama performansı için periyodik bir ihtiyaçtır.