freeCodeCamp/curriculum/challenges/chinese/09-information-security/information-security-with-helmetjs/mitigate-the-risk-of-clickjacking-with-helmet.frameguard.md

id, title, challengeType, forumTopicId

id	title	challengeType	forumTopicId
587d8247367417b2b2512c38	使用 helmet.frameguard() 降低点击劫持的风险	2	301582

--description--

请注意，本项目在 这个 Repl.it 项目 的基础上进行开发。你也可以从 GitHub 上克隆。

黑客可能会不经过你的允许，把你的页面嵌套在 `或者 标签里，用以实现“点击劫持”。点击劫持是一种视觉上的欺骗手段，让用户误以为自己在与所看到的网页交互。通过 iframe，黑客可以在你的页面上添加一个透明的“层”，然后把自己的恶意代码放在一个用户看不到的按钮中。这样一来，你网站的执行环境就被黑客设置成了他想要的效果。helmet 中间件可以设置 header 中的 X-Frame-Options 字段，这样我们就能设置哪些人才可以通过 frame/iframe 引入我们的页面了。这个配置有三个选项：DENY、SAMEORIGIN、ALLOW-FROM。 在这个挑战中，我们的应用不需要被 iframe 引用。 `

--instructions--

请调用 helmet.frameguard()，并传入配置对象 {action: 'deny'}。

--hints--

应正确加载 helmet.frameguard() 中间件

(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);
    }
  );

应将 helmet.frameguard() 中的 action 值设置为 'DENY'

(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);
    }
  );

--solutions--