- Konu sahibi
- #1
data:text/html, web sunucusundan dosya istemek yerine HTML içeriğini doğrudan URL'nin içine yerleştiren bir data URL ifadesidir. Tarayıcı bu ifadeyi açtığında, URL'deki veriyi HTML belge olarak yorumlar. Bu nedenle küçük test sayfaları, tek dosyalık örnekler ve geçici içerikler için kullanılabilir; normal bir web sitesinin ana yayın yöntemi olarak tercih edilmez.Yapısı nasıl çalışır?
Temel biçim şöyledir:
Kod:
data:[medya-türü][;parametre][;base64],veriHTML için en kısa biçim
data:text/html,HTML-İÇERİĞİ olur. text/html bölümünün anlamı, virgülden sonra gelen verinin HTML olduğunu belirtmektir. charset=utf-8 gibi bir parametre karakter kodlamasını açıkça belirtmek için eklenebilir. İçerik doğrudan yazılabileceği gibi base64 ile kodlanmış olarak da verilebilir.Doğrudan metin biçiminde boşluk,
# ? % gibi URL içinde özel anlamı olan karakterler yüzde kodlamasıyla yazılmalıdır. Örneğin boşluk %20, Türkçe Ç karakteri ise UTF-8 yüzde kodlamasında %C3%87 olarak gösterilebilir. HTML içeriği büyüdükçe URL'nin okunması ve hata ayıklanması zorlaşır.Çalıştırılabilir en küçük örnek
Aşağıdaki ifade küçük bir HTML belgesini URL içinde taşır. Yüzde kodları çözüldüğünde başlık ve paragraf işaretlemesi elde edilir:
Kod:
data:text/html;charset=utf-8,%3C!doctype%20html%3E%3Ctitle%3EDeneme%3C/title%3E%3Ch1%3EMerhaba%3C/h1%3E%3Cp%3EBu%20bir%20data%20URL%20sayfas%C4%B1d%C4%B1r.%3C/p%3EBeklenen sonuç, başlığında “Deneme”, sayfada da “Merhaba” ve açıklama metni bulunan basit bir HTML belgesidir. Burada
%3C ve %3E karakterleri sırasıyla < ve > işaretlerinin URL kodlanmış hâlidir.- Virgülden önceki medya türünü ve charset parametresini ayırın.
- Virgülden sonraki yüzde kodlarını UTF-8 olarak çözümlediğinizde doctype, title, h1 ve p öğelerini elde edersiniz.
- Base64 işareti varsa veri o yöntemle çözülür. Base64 şifreleme veya HTML temizleme yöntemi değildir.
- Normal bağlantıdan data URL'ye üst sayfa gezintisi modern tarayıcılarda güvenlik nedeniyle engellenebilir. Açılmamasını tek başına URL sözdizimi hatası saymayın; tarayıcı güvenliğini kapatmayın.
| Biçim | Örnek | Ne zaman kullanılır? |
|---|---|---|
| Doğrudan metin | data:text/html,%3Ch1%3EMerhaba%3C%2Fh1%3E | Kısa ve okunabilir testlerde |
| UTF-8 belirterek | data:text/html;charset=utf-8,%C3%87al%C4%B1%C5%9F%C4%B1yor | Türkçe veya özel karakter içeren kısa içerikte |
| Base64 | data:text/html;base64,PGgxPk1lcmhhYmE8L2gxPg== | Özel karakterleri URL içinde taşımak zor olduğunda |
Ne zaman kullanılmalı, ne zaman kullanılmamalı?
Küçük bir HTML denemesi, dokümantasyonda tek bağlantıyla örnek gösterme veya geçici bir çıktı için
data:text/html kullanmak pratiktir. Kalıcı sayfalarda ise HTML'yi ayrı bir dosyada tutmak daha doğru olur. Böylece içerik düzenlenebilir, tarayıcı geliştirici araçlarında daha kolay incelenebilir, göreli CSS ve JavaScript dosyaları yönetilebilir ve uzun URL'lerin kopyalanmasından kaynaklanan hatalar azalır.Modern tarayıcılarda data belgesi kendine özgü opaque origin alır; normal https sayfasının kökenini devraldığı varsayılmaz. Göreli dosya yolları, tarayıcı güvenlik kuralları ve açıldığı bağlam nedeniyle beklenmedik davranabilir. Ayrıca kullanıcıdan alınan veya güvenilmeyen HTML'yi doğrudan data URL'ye dönüştürmek, içerik çalıştırma riskleri doğurabilir; bu kullanım yalnızca güvenilen ve gerektiğinde temizlenmiş içerikle sınırlandırılmalıdır.
Kaynaklar
Sık sorulan sorular
data:text/html ile normal HTML dosyası arasındaki temel fark nedir?
Normal HTML dosyası bir dosya yolu veya web sunucusu üzerinden yüklenir.
data:text/html ise belge içeriğini URL'nin içinde taşır; bu yüzden ayrı bir dosya barındırmadan açılabilir.Neden sayfanın adresinde HTML kodu yerine yüzde işaretleri görünüyor?
Bunlar URL kodlamasıdır. Tarayıcı, HTML'deki URL için özel anlam taşıyan karakterleri güvenli biçimde taşımak amacıyla yüzde işareti ve iki onaltılık basamak kullanır; bu durum kodun HTML olmadığı anlamına gelmez.
data:text/html bir web sitesini internete yayınlar mı?
Hayır. İçerik URL'yi açan kişide bulunur; bu ifade tek başına sunucuya dosya yüklemez, alan adı oluşturmaz ve bir siteyi arama motorlarına kalıcı olarak yayınlamaz.
