Kullanıcıları Kandırıp Uyarıları Aşan Modern SVG Clickjacking Saldırısı

• SVG filtrelerini kullanan yeni bir clickjacking tekniği sunuldu ve geleneksel basit tıklama yönlendirme saldırılarını daha karmaşık, etkileşimli saldırılara dönüştürüyor
• feColorMatrix, feDisplacementMap gibi SVG filtre öğelerinin cross-origin iframe'lere de uygulanabildiği doğrulandı; bu sayede görsel manipülasyon ve veri çıkarımı mümkün oldu
• Filtre kombinasyonlarıyla piksel okuma, mantıksal işlemler ve koşula dayalı UI manipülasyonu yapılarak çok aşamalı clickjacking veya girdi yönlendirme saldırıları uygulanabiliyor
• Gerçek bir örnekte Google Docs zafiyeti kullanılarak başarılı bir saldırı gerçekleştirildi ve araştırmacı Google VRP'den $3,133.70 ödül aldı
• Bu teknik, tarayıcı güvenlik modelinde yeni bir saldırı yüzeyi açığa çıkararak, SVG filtrelerinin mantıksal kullanımla güvenlik tehdidine dönüşebileceğini gösteriyor

---

SVG clickjacking'e genel bakış

• Geleneksel clickjacking, bir iframe'in üstüne yerleştirilmiş bir katmanla kullanıcının istemeden tıklama yapmasını sağlayan basit bir saldırı modeliydi
• Yeni sunulan SVG clickjacking, SVG filtreleri sayesinde karmaşık etkileşimler ve veri sızıntısı sağlar
• feColorMatrix ve feDisplacementMap gibi filtrelerin cross-origin belgelere uygulanabildiği, böylece dış içeriklerin görsel olarak manipüle edilebildiği doğrulandı

SVG filtresinin bileşenleri

• Başlıca filtre öğeleri <feImage> , <feFlood> , <feOffset> , <feDisplacementMap> , <feGaussianBlur> , <feTile> , <feMorphology> , <feBlend> , <feComposite> , <feColorMatrix>
• Bu öğeler, giriş görüntüsünü birleştirip dönüştürerek yeni bir görüntü oluşturur ve zincir halinde bağlanabilir
• Bu kombinasyonlarla saldırganın görsel efekt, maskeleme, renk manipülasyonu gibi işlemleri istediği gibi uygulaması mümkün hale gelir

Saldırı örnekleri

• Sahte captcha (fake captcha): feDisplacementMap kullanılarak metin bozularak kullanıcıdan hassas bir kod girmesi istenir
• Gri metin gizleme (grey text hiding): feComposite ve feMorphology ile giriş kutusundaki ipucu veya hata mesajları kaldırılarak kullanıcı, saldırganın belirlediği parolayı girmeye yönlendirilir
• Piksel okuma (pixel reading): Belirli bir pikselin rengini algılayıp filtre davranışını kontrol ederek düğme tıklama, fareyle üzerine gelme ve giriş durumu algılama gibi dinamik tepki veren saldırılar uygulanır

Mantıksal işlem ve birleşik saldırılar

• feBlend ve feComposite kombinasyonuyla AND, OR, XOR, NOT gibi mantıksal kapılar uygulanabilir
• Böylece SVG filtresi içinde tam bir mantık devresi kurulabilir ve çok adımlı clickjacking senaryoları otomatikleştirilebilir
• Örnek olarak ‘Securify’ uygulama saldırısında, pencere açma, onay kutusu tıklama ve düğme tıklama gibi adımlar mantıksal olarak kontrol edilerek kullanıcı kandırma yapısı kurulur

Gerçek örnek: Google Docs zafiyeti

• Google Docs'ta Generate Document butonuna tıklandıktan sonra çıkan açılır pencere ve giriş alanı, SVG filtre tabanlı mantıkla algılanıp manipüle edilir
• Giriş alanının odak durumu, gri metin ve yükleme ekranı gerçek zamanlı olarak algılanarak saldırı akışı kontrol edilir
• Bu saldırı Google'a bildirildi ve $3,133.70 bug bounty ödülü verildi

QR kodu uygulamaları

• SVG filtre içinde QR kod üretim mantığı uygulanarak piksel verileri URL olarak kodlanır ve QR biçiminde gösterilebilir
• Kullanıcı QR kodu taradığında, veriler saldırganın kontrolündeki sunucuya iletilir
• Tarama yapılabilir QR üretimi için feDisplacementMap ve Reed–Solomon hata düzeltme birlikte kullanılır

Ek kullanım senaryoları

• Metin okuma, tıklama tabanlı veri sızıntısı, sahte fare imleci ekleme gibi farklı saldırı senaryoları mümkündür
• JavaScript olmadan yalnızca CSS/SVG ile saldırı kurmak mümkün olduğu için CSP atlatma olasılığı ortaya çıkıyor

Araştırma bulgusu

• SVG filtreleriyle mantıksal işlem tabanlı clickjacking, önceki araştırmalarda ele alınmamış yeni bir saldırı tekniği olarak öne çıkıyor
• Önceki çalışmalar SVG'yi yalnızca basit görsel maskeleme amacıyla anarken, bu çalışma mantıksal yürütme ve etkileşim kontrolünü kanıtlıyor
• Araştırmacı bunu yeni bir zafiyet sınıfı olarak tanımlayarak, tarayıcı güvenlik modelinin yeniden gözden geçirilmesi gerektiğini vurguluyor

Sonuç

• Bu çalışma, SVG filtrelerini bir programlama dili gibi kullanan ilk güvenlik saldırısı örneği olarak değerlendiriliyor
• Yazar, 2025 sonu 39c3 ve Disobey 2026'da ilgili sunumların yapılacağını belirtiyor
• Gönderi, sadece HTML/CSS/SVG ile, görsel veya JS olmadan 42kB boyutunda hazırlandı ve deneysel güvenlik araştırmalarının yaratıcılığını gösteriyor

[GN⁺]

Hacker News yorumu

• Geliştirici X-Frame-Options başlığını düzgün ayarlarsa bu sorun çözülür
  Ama pratikte muhtemelen güvenlik sorunlarının peşinden koşup tarayıcıda SVG spesifikasyonunun yarısını siler gibi bir yaklaşımla karşılık verilir

  • Tam olarak çözülmüş değil. Bazı uygulamalarda (ör. Google Docs) çerçeveleme gerekir
    Ayrıca çerçeveleme değil de HTML enjeksiyonu yapılabilen sitelerde de bu saldırı mümkündür
  • SVG içinde çok fazla güvenlik mayını var. Özellikle kullanıcı tarafından sağlanan SVG gibi güvenilmez durumlarda en basit çözüm bunu tamamen devre dışı bırakmaktır

• Ben zaten güvenlik nedeniyle SVG’yi kapatmış durumdayım
  Ama artık CSS’yi bile devre dışı bırakmak gerekip gerekmediğini düşünmeye başladım
  Keşke CSS sadece metni biçimlendirmek için kalsaydı; artık bir programlama dili gibi hale geldi ve hackerlar ya da reklamverenler tarafından kötüye kullanılması kolaylaştı

  • “Keşke CSS’yi basit bıraksalardı” sözüne katılıyorum, ama aslında bu tür saldırılar 2000’lerin sonlarında çok daha kolaydı
    Şimdi ise neredeyse imkânsız denecek kadar zor
  • Ben güvenliği artırmak için tarayıcıyı bozmak yerine, hassas veriyi baştan tarayıcının dışında tutmanın daha iyi olduğunu düşünüyorum
  • Sorunun özü CSS değil, iFrame. Tarayıcıların ilk günlerinden beri süregelen güvenlik açıklarının kaynağı bu
  • Bu demoya ek olarak başka güvenlik gerekçeleri var mı merak ediyorum. Çoğu platformda bu saldırı çalışmıyor
  • Bu aşırı bir tepki olur. Böyle bir saldırıya yakalanma olasılığı çok düşük ve sandbox ya da oturum çerezlerini de aşamaz

• “Bir pikselin saf siyah olup olmadığını algılayıp filtreyi açıp kapatma örneğini” görünce tamamen afalladım
  HTML/CSS neden bu kadar karmaşık hale geldi, anlamıyorum
  Gizli bir <checkbox> ve <label> var; tıklayınca onay kutusu değişiyor ve yalnızca CSS ile duruma göre stil değişiyor
  SVG gerçekte hiçbir şey çizmiyor, sadece filtre tanımlıyor
  İki tane <feTile> kullanılıp döşeme alanı ile çıktı alanının ayrı tanımlanması da tuhaf bir yapı
  <fake-frame> ya da <art-frame> gibi öğeler de ne oluyor?

  • Bence bu yapı oldukça havalı. JavaScript olmadan da etkileşimli içerik üretilebiliyor
    <label> tıklandığında onay kutusunun değişmesi HTML’in varsayılan davranışıdır
    CSS’nin :has() seçicisiyle durum algılanıyor
    <feTile> tek bir filtre öğesidir; girdi görselini döşemek ya da kırpmak için kullanılır
    <fake-frame> ve <art-frame> ise doğrudan tanımlanmış özel öğelerdir
    İlgili konuyu blog yazısında anlattım
  • Aslında bu özelliklerin çoğu “modern” olmaktan çok 90’lardan beri var olan şeyler
    <label> tıklanınca odağın taşınması masaüstü arayüz geleneğinin bir uzantısı
    Onay kutusu durumuna göre stil değiştirmek de Firefox 1 döneminden beri vardı
    SVG filtrelerini HTML içine doğrudan gömmek de eski bir özellik
    Yani bu, yeni HTML’in sorunu değil; eski özelliklerin birleşimi

• Bu demo bana eski Flash Player hack’lerini hatırlattı
  Kullanıcıyı sistem depolamasına izin vermesi için kandıran o yönteme benziyor
  Vektör grafikler gerçekten de kendi kendini kontrol edemeyen bir şey gibi görünüyor

• SVG adder bir sanat eseri gibi. Gerçekten harika

  • Çok güçlü bir demoydu. Bunu bugün ilk kez öğrendim: Turing tamlığı için yalnızca işlevsel tamlık yetmiyor, depolama ve rastgele erişim de gerekiyor
    Bununla ilgili olarak Stack Overflow gönderisine baktım

• Android Chrome’umda (daha doğrusu Kiwi Browser’da) muhtemelen karanlık mod yüzünden ekran bozuk ya da tuhaf görünüyor
  Bunu yaşayan başka biri var mı merak ediyorum

  • Firefox’ta örneğin düzgün görünmesi için Dark Reader’ı kapatmam gerekti
  • Yakınlaştırma oranı %100 değilken QR ile ilgili örnek bozuluyor

• Bu yazı bana daha önce gördüğüm CSS hesaplama demosunu hatırlattı

• Gerçekten etkileyici bir çalışma. Nasıl çözüleceğini bilmiyorum ama çok yakında düzeltilmesi gerekiyor

• Çok harika bir yazıydı. Baştan sona keyifle okudum