HTML kodlama ve URL kodlama arasındaki fark nedir?

HTML kodlaması (örn: <), özel karakterleri *bir HTML belgesi içinde* güvenle görüntülemek içindir. URL kodlaması (örn: %3C), özel karakterleri *bir URL içinde* güvenle iletmek içindir. Farklı sorunları çözerler ve birbirinin yerine kullanılamazlar. Örneğin, & karakteri HTML'de & iken URL'de %26'dır.

HTML kodlaması XSS'i nasıl önler?

XSS (Siteler Arası Komut Dosyası Çalıştırma), tarayıcıyı kötü amaçlı bir etiketini çalıştırması için kandırarak çalışır. HTML kodlaması, karakterlerini < ve > haline getirir. Tarayıcı bu varlıkları gördüğünde, onları bir HTML etiketinin başı veya sonu olarak yorumlamak *yerine* gerçek metin karakterleri olarak işler. Bu, kötü amaçlı betiği 'etkisiz hale getirir' ve zararsız kılar.

HTML Varlığı (Entity) nedir?

Bir HTML varlığı, ve (ampersand) işareti (&) ile başlayan ve noktalı virgül (;) ile biten bir metin parçasıdır ('dize'). Tarayıcının belirli bir karakterle değiştirdiği bir 'jetondur'. Örnekler arasında < ( için), & (& için), © (© için) ve (kesintisiz boşluk için) bulunur.

HTML Escape ve Unescape nedir?

Escape (veya Kodlama), düz metni HTML varlıklarına dönüştürme işlemidir (örn: 'Merhaba > Dünya', 'Merhaba > Dünya' olur). Unescape (veya Kod Çözme), HTML varlıklarını tekrar düz metne dönüştürme işlemidir (örn: 'Merhaba > Dünya', 'Merhaba > Dünya' olur).

HTML Kodlama / Kod Çözme Aracı

Metni HTML için kodlayın (escape) veya kodunu çözün (unescape). XSS'i önler.

Giriş Metni

Mod

Çıktı

Güvenliğiniz Önemlidir: İstemci Taraflı İşleme

Tüm işlemler tarayıcınızda gerçekleşir.
Verileriniz, resimleriniz, dosyalarınız, anahtarlarınız veya parolalarınız asla saklanmaz veya sunucularımıza gönderilmez.
Oluşturduğunuz içeriği izlemiyoruz veya takip etmiyoruz.

HTML Kodlama (HTML Escape) Nedir?

HTML kodlama, **HTML escape** olarak da bilinir, özel karakterleri karşılık gelen **HTML Varlıklarına** dönüştürme işlemidir. HTML, yapısını (etiketler ve nitelikler) tanımlamak için <, >, &, ve " gibi karakterleri kullandığı için bu işlem zorunludur.

Problem: Bu karakterleri düz metin olarak *görüntülemek* isterseniz (örneğin, <p>Merhaba</p> gibi bir kod parçacığı göstermek için), bunları doğrudan yazamazsınız. Tarayıcı, bunları HTML kodu olarak *yorumlamaya* çalışacak, sayfa düzeninizi bozacak veya daha da kötüsü bir güvenlik açığı yaratacaktır.

Çözüm: Onları "escape" etmelisiniz. Tarayıcı, varlıkları kod olarak değil, temsil ettikleri karakter olarak işler.

<, < olur
>, > olur
&, & olur
", " olur
', ' (veya ') olur

Bu Çevirici için Temel Kullanım Alanları:

XSS Saldırılarını Önleme: Bu en kritik kullanım alanıdır. Kullanıcı tarafından sağlanan metni (bir yorum gibi) sayfanızda görüntülerseniz, bir saldırgan <script>...</script> girebilir. Bu girdiyi **HTML escape ederek**, tarayıcı kötü amaçlı betiği *çalıştırmak* yerine <script>...</script> metnini *görüntüler*.
Kod Parçacıklarını Görüntüleme: Kullanıcıların okuyabilmesi için web sayfanızda HTML, XML veya herhangi bir kaynak kodu göstermek.
Özel Karakterleri İşleme: Telif hakkı simgesi (© için ©) veya kesintisiz boşluk ( ) gibi klavyenizde olmayan karakterleri görüntülemek için.

HTML çevirici aracımız, herhangi bir metni kolayca HTML varlıklarına kodlamanıza (escape) veya bunları tekrar okunabilir metne çözmenize (unescape) olanak tanır.

HTML Kodlama/Kod Çözme Örnekleri

HTML örnekleri yükleniyor...

HTML Kodlama En İyi Uygulamaları ve Temel Kavramlar

🛡️

Girdide Değil, Çıktıda Kodlayın

Yaygın bir hata, veriyi bir veritabanında saklamadan *önce* kodlamaktır. En iyi uygulama, ham, temiz veriyi saklamak ve **yalnızca bir HTML sayfasına işlerken** kodlamaktır. Bu, verilerinizi taşınabilir (örn. JSON API'leri için) tutar ve doğru bağlam için doğru kodlamayı uygulamanızı sağlar.

🎯

Bağlam Çok Önemlidir

Her kodlama aynı değildir. Bir HTML etiketi (... gibi) içini escape etmek, tırnak işaretlerini de escape etmeniz gereken bir HTML niteliğinden (<input value="..."> gibi) farklıdır. JavaScript (bir <script> bloğunda) için JS dize escape etme işlemine ihtiyacınız vardır. Bu araç, standart HTML gövdesi escape etme işlemine odaklanır.

🗒️

Kod için <pre> ve <code> Kullanın

Kod görüntülerken, basit kodlama biçimlendirmeyi (boşluklar ve satır sonları gibi) korumak için yeterli değildir. En iyi sonuçlar için, *kodlanmış* kod parçacığınızı bir <pre> (boşluğu korumak için) ve bir <code> (anlamsal önem için) etiketiyle sarın: <pre><code>...kodlanmış içeriğiniz...</code></pre>.