`) that covers the entire visible area of a legitimate website. This element is made transparent using CSS properties like `opacity: 0;`. * Positioning and Layering: By setting the CSS properties such as `position: absolute; top: 0; left: 0;`, the transparent element is positioned to cover the entire viewport. Since it's transparent, the user doesn't see it. * Misleading User Interaction: The attacker places deceptive elements within the transparent container, such as fake buttons, links, or forms. These elements perform actions when clicked, but the user is unaware of their presence due to the overlaying transparent UI element. * User Interaction: When the user interacts with the visible interface, they are unknowingly interacting with the hidden elements due to the transparent overlay. This interaction can lead to unintended actions or unauthorized operations. ```html

Click me

``` ### Invisible Frames Invisible Frames is a Clickjacking technique where attackers use hidden iframes to trick users into interacting with content from another website unknowingly. These iframes are made invisible by setting their dimensions to zero (height: 0; width: 0;) and removing their borders (border: none;). The content inside these invisible frames can be malicious, such as phishing forms, malware downloads, or any other harmful actions. * **How Invisible Frames Work:** * Hidden IFrame Creation: The attacker includes an ` ``` * Loading Malicious Content: The src attribute of the iframe points to a malicious website or resource controlled by the attacker. This content is loaded silently without the user's knowledge because the iframe is invisible. * User Interaction: The attacker overlays enticing elements on top of the invisible iframe, making it seem like the user is interacting with the visible interface. For instance, the attacker might position a transparent button over the invisible iframe. When the user clicks the button, they are essentially clicking on the hidden content within the iframe. * Unintended Actions: Since the user is unaware of the invisible iframe, their interactions can lead to unintended actions, such as submitting forms, clicking on malicious links, or even performing financial transactions without their consent. ### Button/Form Hijacking Button/Form Hijacking is a Clickjacking technique where attackers trick users into interacting with invisible or hidden buttons/forms, leading to unintended actions on a legitimate website. By overlaying deceptive elements on top of visible buttons or forms, attackers can manipulate user interactions to perform malicious actions without the user's knowledge. * **How Button/Form Hijacking Works:** * Visible Interface: The attacker presents a visible button or form to the user, encouraging them to click or interact with it. ```html ``` * Invisible Overlay: The attacker overlays this visible button or form with an invisible or transparent element that contains a malicious action, such as submitting a hidden form. ```html ``` * Deceptive Interaction: When the user clicks the visible button, they are unknowingly interacting with the hidden form due to the invisible overlay. The form is submitted, potentially causing unauthorized actions or data leakage. ```html ``` ### Execution Methods * Creating Hidden Form: The attacker creates a hidden form containing malicious input fields, targeting a vulnerable action on the victim's website. This form remains invisible to the user. ```html ``` * Overlaying Visible Element: The attacker overlays a visible element (button or form) on their malicious page, encouraging users to interact with it. When the user clicks the visible element, they unknowingly trigger the hidden form's submission. * Example in javascript: ```js function submitForm() { document.getElementById('hidden-form').submit(); } ``` ## Preventive Measures ### Implement X-Frame-Options Header Implement the X-Frame-Options header with the DENY or SAMEORIGIN directive to prevent your website from being embedded within an iframe without your consent. ```apache Header always append X-Frame-Options SAMEORIGIN ``` ### Content Security Policy (CSP) Use CSP to control the sources from which content can be loaded on your website, including scripts, styles, and frames. Define a strong CSP policy to prevent unauthorized framing and loading of external resources. Example in HTML meta tag: ```html ``` ### Disabling JavaScript * Since these type of client side protections relies on JavaScript frame busting code, if the victim has JavaScript disabled or it is possible for an attacker to disable JavaScript code, the web page will not have any protection mechanism against clickjacking. * There are three deactivation techniques that can be used with frames: * Restricted frames with Internet Explorer: Starting from IE6, a frame can have the "security" attribute that, if it is set to the value "restricted", ensures that JavaScript code, ActiveX controls, and re-directs to other sites do not work in the frame. ```html ``` * Sandbox attribute: with HTML5 there is a new attribute called “sandbox”. It enables a set of restrictions on content loaded into the iframe. At this moment this attribute is only compatible with Chrome and Safari. ```html ``` ## OnBeforeUnload Event * The `onBeforeUnload` event could be used to evade frame busting code. This event is called when the frame busting code wants to destroy the iframe by loading the URL in the whole web page and not only in the iframe. The handler function returns a string that is prompted to the user asking confirm if he wants to leave the page. When this string is displayed to the user is likely to cancel the navigation, defeating target’s frame busting attempt. * The attacker can use this attack by registering an unload event on the top page using the following example code: ```html

www.fictitious.site