1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
|
---
title: X-Frame-Options
slug: Web/HTTP/Headers/X-Frame-Options
tags:
- Cabeçalho de Resposta
- Express
- Gecko
- HAProxy
- HTTP
- IIS
- Segurança
- nginx
translation_of: Web/HTTP/Headers/X-Frame-Options
---
<div>{{HTTPSidebar}}</div>
<p>O cabeçalho de resposta <a href="/en-US/docs/Web/HTTP">HTTP</a> <strong><code>X-Frame-Options</code></strong> pode ser usado para indicar se o navegador deve ou não renderizar a página em um {{HTMLElement("frame")}}, {{HTMLElement("iframe")}}, {{HTMLElement("embed")}} ou {{HTMLElement("object")}}. Sites podem usar isso para evitar ataques <em><a href="/en-US/docs/Web/Security/Types_of_attacks#Click-jacking">click-jacking</a></em>, assegurando que seus conteúdos não sejam embebedados em outros sites.</p>
<p>A segurança adicionada é provida somente se o usuário acessando o documento está usando o navegador que suporte <code>X-Frame-Options</code>.</p>
<div class="note">
<p><strong>Nota:</strong> O cabeçalho HTTP {{HTTPHeader("Content-Security-Policy")}}possui uma diretiva <code><a href="/docs/Web/HTTP/Headers/Content-Security-Policy/frame-ancestors">frame-ancestors</a></code> que torna este cabeçalho obsoleto para navegadores que o suportam.</p>
</div>
<table class="properties">
<tbody>
<tr>
<th scope="row">Tipo de cabeçalho</th>
<td>{{Glossary("Response header")}}</td>
</tr>
<tr>
<th scope="row">{{Glossary("Forbidden header name")}}</th>
<td>não</td>
</tr>
</tbody>
</table>
<h2 id="Sintaxe">Sintaxe</h2>
<p>Existem duas diretivas possíveis para <code>X-Frame-Options</code>:</p>
<pre class="syntaxbox notranslate">X-Frame-Options: DENY
X-Frame-Options: SAMEORIGIN
</pre>
<h3 id="Diretivas">Diretivas</h3>
<p>Se você especifica <code>DENY</code>, não somente tentativas em carregar a página em um enquadramento irão falhar quando carregadas de outros sites, mas irão falhar também se forem carregadas do mesmo site. Por outro lado, se você especifica <code>SAMEORIGIN</code>, você ainda pode usar a página em um enquadramento enquanto o site que o está incluindo no enquadramento seja o mesmo servindo a página.</p>
<dl>
<dt><code>DENY</code></dt>
<dd>A página não pode ser mostrada em um enquadramento, independente do site que esteja tentando fazer isso.</dd>
<dt><code>SAMEORIGIN</code></dt>
<dd>A página só pode ser exibida em um enquadramento se for da mesma origem da página em si. A especificação deixa a cargo do navegador para decidir se esta opção se aplica ao nível mais alto, ao parente, ou à cadeia inteira, entretanto é discutido se a opção não é muito útil a não ser que todos os ancestrias estejam na mesma origem (veja {{bug(725490)}}). Veja também {{anch("Browser compatibility")}} para mais detalhes de suporte.</dd>
<dt><code>ALLOW-FROM <em>uri</em></code><em> </em>{{obsolete_inline()}}</dt>
<dd>Esta é uma diretiva obsoleta que não funciona mais em navegadores modernos. Não a utilize. Em navegadores legado que a suportam, a página pode ser mostrada em um enquadramento somente na URI de origem especificada. Note que implementação legada do Firefox isso ainda sofria do mesmo problema que a <code>SAMEORIGIN</code> sofreu — ela não checa se os enquadramentos ancestrais para ver se eles são da mesma origem. O cabeçalho HTTP {{HTTPHeader("Content-Security-Policy")}} tem a diretiva <code>frame-ancestors</code> que você pode usar ao invés disso.</dd>
</dl>
<h2 id="Exemplos">Exemplos</h2>
<div class="note">
<p><strong>Nota:</strong> Colocar X-Frame-Options dentro de um elemento {{HTMLElement("meta")}} é inútil! Por enquanto, <code><meta http-equiv="X-Frame-Options" content="deny"></code> não tem nenhum efeito. Não o utilize! <code>X-Frame-Options</code> funciona somenete colocando a configuração através do cabeçalho HTTP, como nos exemplos abaixo.</p>
</div>
<h3 id="Configurando_o_Apache">Configurando o Apache</h3>
<p>Para configurar o Apache para que ele envie o cabeçalho <code>X-Frame-Options</code> para todas as páginas, adicione isto nas configurações do seu site:</p>
<pre class="notranslate">Header always set X-Frame-Options "SAMEORIGIN"
</pre>
<p>Para configurar o Apache para colocar o <code>X-Frame-Options</code> como DENY, adicione isto nas configurações do seu site:</p>
<pre class="notranslate">Header set X-Frame-Options "DENY"
</pre>
<h3 id="Configurando_o_nginx">Configurando o nginx</h3>
<p>Para configurar o nginx para enviar o cabeçalho <code>X-Frame-Options</code>, adicione isto na configuração do seu http, servidor ou localização:</p>
<pre class="notranslate">add_header X-Frame-Options SAMEORIGIN always;
</pre>
<h3 id="Configurando_o_IIS">Configurando o IIS</h3>
<p>Para configurar o IIS para enviar o cabeçalho <code>X-Frame-Options</code>, adicione isto no arquivo <code>Web.config</code> do seu site:</p>
<pre class="brush: xml notranslate"><system.webServer>
...
<httpProtocol>
<customHeaders>
<add name="X-Frame-Options" value="SAMEORIGIN" />
</customHeaders>
</httpProtocol>
...
</system.webServer>
</pre>
<p>Ou veja este <a href="https://support.office.com/en-us/article/Mitigating-framesniffing-with-the-X-Frame-Options-header-1911411b-b51e-49fd-9441-e8301dcdcd79">artigo de suporte de configuração da Microsoft utilizando a interface de usuário IIS Manager</a>.</p>
<h3 id="Configurando_o_HAProxy">Configurando o HAProxy</h3>
<p>Para configurar o HAProxy para enviar o cabeçalho <code>X-Frame-Options</code>, adicione isto na sua configuração do seu <em>front-end</em>, <em>listen</em>, ou <em>backend</em>:</p>
<pre class="notranslate">rspadd X-Frame-Options:\ SAMEORIGIN
</pre>
<p>Alternativamente, em versões mais novas:</p>
<pre class="notranslate">http-response set-header X-Frame-Options SAMEORIGIN
</pre>
<h3 id="Configurando_o_Express">Configurando o Express</h3>
<p>Para configurar o Express para enviar o cabeçalho <code>X-Frame-Options</code>, você pode usar o <a href="https://helmetjs.github.io/">helmet</a> que utiliza o <a href="https://helmetjs.github.io/docs/frameguard/">frameguard</a> para colocar o cabeçalho. Adicione isto na configuração do seu servidor:</p>
<pre class="brush: js notranslate">const helmet = require('helmet');
const app = express();
app.use(helmet.frameguard({ action: 'SAMEORIGIN' }));
</pre>
<p>Alternativamente, você pode usar o <em>frameguard</em> diretamente:</p>
<pre class="brush: js notranslate">const frameguard = require('frameguard')
app.use(frameguard({ action: 'SAMEORIGIN' }))
</pre>
<h2 id="Especificações">Especificações</h2>
<table class="standard-table">
<thead>
<tr>
<th scope="col">Especificação</th>
<th scope="col">Título</th>
</tr>
</thead>
<tbody>
<tr>
<td>{{RFC("7034")}}</td>
<td>HTTP Header Field X-Frame-Options</td>
</tr>
</tbody>
</table>
<h2 id="Compatibilidade_de_navegador">Compatibilidade de navegador</h2>
<p>{{Compat("http.headers.X-Frame-Options")}}</p>
<h2 id="Veja_também">Veja também</h2>
<ul>
<li><a href="/docs/Web/HTTP/Headers/Content-Security-Policy/frame-ancestors"><code>frame-ancestors</code> (CSP)</a></li>
<li><a href="https://tools.ietf.org/html/rfc7034">Cabeçalho HTTP X-Frame-Options (HTTP Header Field X-Frame-Options) - RFC 7034</a></li>
<li><a class="external" href="https://blogs.msdn.com/b/ie/archive/2009/01/27/ie8-security-part-vii-clickjacking-defenses.aspx">Defesas contra ClickJacking (ClickJacking Defenses) - IEBlog</a></li>
<li><a href="https://blogs.msdn.com/b/ieinternals/archive/2010/03/30/combating-clickjacking-with-x-frame-options.aspx">Combatendo ClickJacking com X-Frame-Options (Combating ClickJacking with X-Frame-Options) - IEInternals</a></li>
</ul>
|
