crazy_coder
Moderatör
- Katılım
- 20 Şub 2026
- Mesajlar
- 204
- Tepkime puanı
- 0
- Puanları
- 16
1. Çerez (Cookie) Nedir?
Çerezler, web sunucularının tarayıcıya bıraktığı küçük metin dosyalarıdır. Local Storage'dan en büyük farkı, her HTTP isteğiyle birlikte sunucuya otomatik olarak gönderilmeleridir. Bu özellikleri, sunucunun kullanıcıyı tanımasını sağlar (örneğin "Beni Hatırla" seçeneği).
2. JavaScript ile Çerez Oluşturma
JavaScript'te çerezler document.cookie özelliği üzerinden yönetilir. Bir çerez oluştururken sadece anahtar ve değer değil, çerezin ne kadar süre yaşayacağını ve hangi yollarda geçerli olacağını da belirleyebiliriz.
Temel Çerez Oluşturma:
JavaScript:
// En basit haliyle (Tarayıcı kapanınca silinir - Session Cookie)
document.cookie = "kullanici=AhmetYilmaz";
// Süreli çerez (Expires veya Max-Age ile)
// 7 gün sonra silinecek bir çerez:
document.cookie = "dil=TR; max-age=" + (60 * 60 * 24 * 7) + "; path=/";
[]max-age: Saniye cinsinden yaşam süresi.
[]path: Çerezin hangi sayfalarda geçerli olacağı (Genelde / kullanılır).
[]secure: Sadece HTTPS üzerinden gönderilmesini sağlar.
[]SameSite: Üçüncü taraf takibini kısıtlamak için (Strict veya Lax).
3. Çerezleri Okuma ve Ayıklama
Çerezleri okumak, yazmak kadar kolay değildir. document.cookie dediğinizde size tüm çerezleri tek bir string (metin) olarak döner: "user=Ahmet; tema=dark; dil=TR". Bu metni ayıklamak (parse etmek) gerekir.
Pratik Bir Çerez Okuma Fonksiyonu:
JavaScript:
function cerezOku(isim) {
let ad = isim + "=";
let cerezDizisi = document.cookie.split(';'); // Çerezleri ayır
for(let i = 0; i < cerezDizisi.length; i++) {
let c = cerezDizisi[i].trim(); // Boşlukları temizle
if (c.indexOf(ad) == 0) {
return c.substring(ad.length, c.length);
}
}
return "";
}
console.log(cerezOku("kullanici")); // Çıktı: AhmetYilmaz
4. Çerez Silme İşlemi
JavaScript'te bir çerezi silmek için özel bir delete komutu yoktur. Bir çerezi silmenin yolu, onun süresini geçmiş bir tarihe ayarlamaktır.
JavaScript:
// "kullanici" çerezini silmek için max-age değerini 0 yapıyoruz
document.cookie = "kullanici=; max-age=0; path=/";
Local Storage vs Cookies: Hangisini Seçmeli?
| Özellik | Cookies (Çerezler) | Local Storage | Kapasite | 4 KB (Çok küçük) | 5-10 MB (Geniş) |
|---|---|---|---|---|---|
| Sunucu Erişimi | Otomatik gönderilir | Sadece istemci tarafında | |||
| Güvenlik | HttpOnly ile korunabilir | XSS'e daha açıktır | |||
| Kullanım Amacı | Oturum yönetimi, auth token | Tema, sepet, kullanıcı ayarları |
[TR]
Önemli Güvenlik Notu: HttpOnly ve XSS
JavaScript ile oluşturulan her çereze, kötü niyetli scriptler de erişebilir. Ancak, sunucu tarafında (PHP, Node.js vb.) bir çereze HttpOnly bayrağı eklenirse, o çereze JavaScript üzerinden asla erişilemez. Bu, oturum bilgilerini çalmaya yönelik XSS saldırılarına karşı en büyük savunmadır.
Sonuç
Çerezler, kısıtlı kapasitelerine rağmen modern web'in bel kemiğidir. JavaScript ile çerez yönetimi biraz "eski usul" kalsa da, sunucuyla senkronize çalışması gereken veriler için hala tek seçenektir.