freeCodeCamp/curriculum/challenges/english/06-information-security-and.../information-security-with-h.../mitigate-the-risk-of-clickj...

2.1 KiB
Raw Blame History

id title challengeType
587d8247367417b2b2512c38 Mitigate the Risk of Clickjacking with helmet.frameguard() 2

Description

As a reminder, this project is being built upon the following starter project on Glitch, or cloned from GitHub. Your page could be put in a <frame> or <iframe> without your consent. This can result in clickjacking attacks, among other things. Clickjacking is a technique of tricking a user into interacting with a page different from what the user thinks it is. This can be obtained executing your page in a malicious context, by mean of iframing. In that context a hacker can put a hidden layer over your page. Hidden buttons can be used to run bad scripts. This middleware sets the X-Frame-Options header. It restricts who can put your site in a frame. It has three modes: DENY, SAMEORIGIN, and ALLOW-FROM. We dont need our app to be framed. You should use helmet.frameguard() passing with the configuration object {action: 'deny'}.

Instructions

Tests

tests:
  - text: helmet.frameguard() middleware should be mounted correctly
    testString: 'getUserInput => $.get(getUserInput("url") + "/_api/app-info").then(data => { assert.include(data.appStack, "frameguard", "helmet.frameguard() middleware is not mounted correctly"); }, xhr => { throw new Error(xhr.responseText); })'
  - text: helmet.frameguard() 'action' should be set to 'DENY'
    testString: 'getUserInput => $.get(getUserInput("url") + "/_api/app-info").then(data => { assert.property(data.headers, "x-frame-options"); assert.equal(data.headers["x-frame-options"], "DENY");}, xhr => { throw new Error(xhr.responseText); })'

Challenge Seed

Solution

// solution required