Input sanitization
Kullanıcı girişini temizleyip çıktıyı encode ederek XSS önlemeyi öğrenirsin.
HTML escape nedir?
Kullanıcıdan gelen metni HTML olarak sayfaya yazdıracağın zaman escape işlemi yapman gerekir. Bu işlem <, >, & ve " gibi özel karakterleri HTML varlıklarına çevirir.
Böylece tarayıcı bu karakterleri etiket başlangıcı olarak değil, sıradan metin olarak görür. Doğru escape, XSS'nin en temel savunmasıdır.
textContent ile çıktı kodlama
En güvenli çıktı kodlama yöntemi textContent kullanmaktır. Bu özellik, atadığın değeri HTML olarak yorumlamaz; düz metin olarak yazar.
Yani el.textContent = userInput yazdığında, girdi ne olursa olsun etiket olarak işlenmez. Mümkün olduğunca innerHTML yerine textContent tercih et; escape fonksiyonu yazmana bile gerek kalmaz.
Uygulama escapeHtml fonksiyonunu yaz
escapeHtml fonksiyonu yaz, parametre str. Önce str.replace(/&/g, '&') ile & karakterini değiştir, sonra .replace(/</g, '<') ile < ve .replace(/>/g, '>') ile > değiştir. Sonucu döndür.
Örnek çözümü göster
Önce & sonra < sonra > değiştir ve sonucu döndür.
Örnek çözüm:
function escapeHtml(str) {
return str.replace(/&/g, '&').replace(/</g, '<').replace(/>/g, '>');
}Kendini test et
-
Hangisi bir HTML escape işleminin yaptığı iştir?
- Dizeyi eval ile çalıştırmak
- Özel karakterleri HTML varlıklarına çevirmek
- Dizeyi base64 ile kodlamak
- Dizeyi küçük harfe dönüştürmek
Cevabı göster
Özel karakterleri HTML varlıklarına çevirmek — Doğru! Escape, özel karakterleri HTML varlıklarına çevirir.
-
Karakteri HTML varlığına çevir
function escapeHtml(str) { return str.replace(/</g, '____'); }Cevabı göster
function escapeHtml(str) { return str.replace(/</g, '<'); } -
Karakteri varlığıyla eşleştir
- <
- <
- >
- >
- &
- &
- "
- "