网络安全框架_网络安全05 — X框架选项

网络安全框架

• Web Security 01 — Prepare

  网络安全01-准备

• Web Security 02 — Referrer

  Web安全02 —推荐人

• Web Security 03 — X Powered By / Server

  网络安全03 — X技术支持/服务器

• Web Security 05 — X-Frame-Options

  网络安全05 — X框架选项

• Web Security 06 — CSP (Content Security Policy)

  Web安全06 — CSP(内容安全策略)

• Web Security 07 — XSS Protection

  Web安全07 — XSS保护

• Web Security 08 — Sniff

  网络安全08 —嗅探

• Web Security 10 — CSRF

  网络安全10 — CSRF

• Web Security 11 — CORS

  网络安全11 — CORS

1.简介 (1. Intro)

What is X-Frame-Options： The X-Frame-Options HTTP response header can be used to indicate whether or not a browser should be allowed to render a page in a <frame>, <iframe>, <embed> or <object>. Sites can use this to avoid clickjacking attacks by ensuring that their content is not embedded into other sites. (MDN)

什么是X-Frame-Options： X-Frame-Options HTTP响应标头可用于指示是否应允许浏览器在<frame> ， <iframe> ， <embed>或<object>呈现页面<object> 。 网站可以通过确保其内容未嵌入其他网站来避免点击劫持攻击。 ( MDN )

There are mainly three types of options:

主要有三种类型的选项：

• X-Frame-Options: deny

  X-Frame-Options: deny

• X-Frame-Options: sameorigin

  X-Frame-Options: sameorigin

• X-Frame-Options: allow-from https://example.com/

  X-Frame-Options: allow-from https://example.com/

2.演示 (2. Demo)

What will happen if I don’t set any value? Let’s have a test: setup a simple malicious server (Port 8889)staticHack/index.html in which an iframe is added to embed our blog system (8888):

如果我没有设置任何值会怎样？ 让我们进行测试：设置一个简单的恶意服务器(端口8889) staticHack/index.html ，其中添加了一个iframe以嵌入我们的博客系统(8888)：

Backend static file server:

后端静态文件服务器：

Now start our blog system and the malicious server together:

现在一起启动我们的博客系统和恶意服务器 ：

npm i
npm start
npm run-script startHack

The malicious site on 8889 can load our blog site’s content. That’s not what we are expecting.

8889上的恶意网站可以加载我们博客网站的内容。 那不是我们所期望的。

3.如何解决 (3. How to fix)

Quite easy, all we need to do is to set the options to deny in response in backend server indexSafe.js and our blog site won't be embedded in any other sites.

很简单，我们要做的就是将选项设置为deny后端服务器indexSafe.js中的响应，并且我们的博客网站不会嵌入任何其他网站中。

Now start again:

现在重新开始：

npm run-script startSafe
npm run-script startHack

As we can see, our blog system won’t be loaded in any site.

如我们所见，我们的博客系统不会加载到任何站点中。

4.点击劫持示例 (4. Sample of clickjacking)

Let’s talk more about clickjacking. Clickjacking is one kind of common iframe attack where hackers embed an invisible iframe into your document (or embed your document into their own malicious website) and use it to capture users’ interactions. This is a common way to mislead users or steal sensitive data.

让我们更多地讨论点击劫持。 点击劫持是一种常见的iframe攻击，黑客将不可见的iframe嵌入到您的文档中(或将您的文档嵌入到自己的恶意网站中)，并使用它来捕获用户的互动。 这是一种误导用户或窃取敏感数据的常用方法。

In our demo, we will try to load a login user’s main page, and try to lead the user to transfer some points to our account unconsciously. Let’s add another static page staticHack/hijack.html in malicious site to do 2 things:

在我们的演示中，我们将尝试加载登录用户的主页，并尝试引导用户不自觉地将一些积分转移到我们的帐户。 让我们在恶意网站中添加另一个静态页面staticHack/hijack.html来执行以下staticHack/hijack.html操作：

• embed our blog system in an iframe ( so that even a user thinks he is dealing with our coupon system on 8889 but actually he is interacting with blog system on 8888)

  将我们的博客系统嵌入到iframe中 (这样，即使用户认为他在8889上正在使用我们的优惠券系统，但实际上他在8888上正在与博客系统进行交互)

• add buttons and inputs to let user input sensitive data (which should be in exactly same position)

  添加按钮和输入以允许用户输入敏感数据 (应该在完全相同的位置)

node index.js
node indexHack.js

Let’s see our malicious coupon system (localhost:8889/hijack.html).

让我们看看我们的恶意优惠券系统 (localhost：8889 / hijack.html)。

• the input which let user to input Robot Check Code is exactly on the top of the transfer input in our blog system

  用户可以输入机器人检查码的输入正好在我们博客系统中的转移输入的顶部

• the next button is exactly on the top of the transfer button in our blog system

  下一个按钮恰好在我们博客系统中转移按钮的顶部

When we input the user02, and then click next, 5 points will be transferred to user02.

当我们输入user02 ，然后单击“ 下一步”时 ，会将5点转移到user02 。

The problem is, a user won’t click such kind of page, because they see the basic elements of blog system. A simple solution is to set the opacity of the iframe to 0, but another problem will come: the inputs will not be able to focus or type anymore.

问题是，用户不会单击此类页面，因为他们看到了博客系统的基本元素。 一个简单的解决方案是将iframe的不透明度设置为0 ，但是还会出现另一个问题：输入将不再能够聚焦或键入。

Luckily , we can use other solutions:

幸运的是，我们可以使用其他解决方案：

• put iframe in a div

  将iframe放入div

• only show part of it

  只显示一部分

Now our hack sites seems more convincible because we only show part of it:

现在，我们的黑客网站似乎更具说服力，因为我们只展示了其中的一部分：

Where is the code:

代码在哪里：

What is this place? Fredericton Railway Bridge, Fredericton, NB, Canada.

这是什么地方？ 弗雷德里克顿铁路桥，弗雷德里克顿，NB，加拿大。

翻译自: https://medium.com/swlh/web-security-05-x-frame-options-3e7e5ce8d029

网络安全框架