November 16, 2023

Clickjacking: Not Just for the Clicks

Written by Drew Kirkpatrick

Red Team Adversarial Attack Simulation

tl;dr version

You can trick users into "typing" inputs in a clickjacking attack.
YouTube demo: https://www.youtube.com/watch?v=VIEZ1aByFvU

PoC GitHub Repo: https://github.com/hoodoer/dragInputClickjacking

Details:

I recently had an engagement where I was able to iframe sensitive portions of an application that allowed me to modify financial data. However, changing the data to allow "theft" of funds required the admin user to enter numbers, not just click buttons in the application.

I had only used clickjacking attacks that used mouse clicks to perform malicious actions in the past, usually involving a sequence of mouse clicks (a simple example proof of concept here).

Doing some digging, I found references on Hacktricks that indicate that you can perform "typed" inputs in a clickjacking attack, which I had never realized.

While the user can type directly into the hidden input fields in the iframed site, convincing them to do so would be highly unlikely.

However, a game that asks the user to drag an image onto a target might be a more realistic social engineering challenge.

In a draggable HTML element you can trigger an action of typing arbitrary text into a form field, even if that form field is hidden from view in the iframed site. The browser considers this a user-initiated action, and allows the cross-domain inputs.

The code for this is quite simple:

The dataTransfer event allows you to set what is "typed" when the user drops the image. This doesn't have to be an image, but that is certainly a convenient element to have users drag in the proof of concept.

I tried to place this draggable element in a separate iframe that I could layer on top of the hidden/iframed site; however, that didn't seem to work, no matter what z-ordering I used. Apparently, dragging from one iframe to another does not work for this technique, so you'll have some restrictions on where you can place the draggable element in your attack.

In the provided example code I simply place it above the iframed application and make it visible in the step of the attack where I need them to "type" an input value.

In the demonstration code I have a simple page that shows a "paycheck adjustment" form after a button is clicked. On this form an arbitrary amount of money can be entered and submitted to supposedly adjust an employee's paycheck.

We'll add on a cool $10,000,000 for good measure in the demo. Holiday shopping is fast approaching after all.

First, we'll clone the repo and start a local HTTP server:

git clone https://github.com/hoodoer/dragInputClickjacking
cd dragInputClickjacking
python3 -m http.server 80

If you open http://127.0.0.1/clickjackPoc.html on your local machine, the proof of concept will load. If you click the "Start Game" button, the game will start running and you can "play" the game. If you don't click anything after the start button, the game will run, but no clickjacking will be performed. You can refresh the page to restart the "game."

Figure 1 - Clickjacking Proof of Concept

You can see the iframed application partially hidden. In a real clickjacking attack, this would be completely hidden. You can adjust the opacity of the iframed application in the top of the clickjackPoc.html file. By default, it's set to 30%.

Once the user is tricked into clicking the first button, the paycheck adjustment form is now "shown" in the iframed application.

We need our user to "type" $10,000,000 into this field. That's when the next step of the game instructs the user to quickly drag an item onto the target.