aboutsummaryrefslogtreecommitdiff
path: root/files/ru/web/http/feature_policy/using_feature_policy/index.html
blob: 634bbe35440bd2a69aee2d7a7834e533d306ff68 (plain)
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
---
title: Using Feature Policy
slug: Web/HTTP/Feature_Policy/Using_Feature_Policy
translation_of: Web/HTTP/Feature_Policy/Using_Feature_Policy
---


<div>{{HTTPSidebar}}</div>



<p><a href="/en-US/docs/Web/HTTP/Feature_Policy">Функциональная политика</a> позволяет разработчику контролировать доступ страницам сайта к определённой веб функциональности браузера, как страницам высокого уровня, так и встроенным в страницу фреймам. По сути, разработчик определяет политику, которая позволяет использовать определённую функциональность списку разрешённых источников. Каждая функция, контролируемая функциональной политикой, активируется  в определённом документе или фрейме, если его источник происхождения входит в разрешённый список источников.</p>

<p>Для каждой функции, контролируемой функциональной политикой, браузер отслеживает список источников происхождения, для документов которого, эта функция разрешена. Если разработчик не определил политику для функциональности, тогда будет использован список разрешённых источников по умолчанию. Этот список специфичен для каждой функциональности. </p>

<h2 id="Описание_политики">Описание политики</h2>

<p>Политика определяется, используя набор индивидуальных установочных директив. Установочная директива - это комбинация имён определяемых функциональностей, со списком источников происхождения, которым разрешается доступ к указанной функциональности. Имена функциональностей в политике разделяются точкой с запятой.</p>

<h3 id="список_доступа">список доступа</h3>

<p>Список доступа - это список источников происхождения, которые принимают одно или несколько следующих значений, разделяемых пробелом:</p>

<ul>
 <li><code>*</code>: Функциональность разрешается в документе и всем вложенным в документ браузерным контекстам (элементам <code>iframes</code>) вне зависимости от источника их происхождения.</li>
 <li><code>'self'</code>: Функциональность разрешается в документе и всем вложенным в него браузерным контекстам (элементам <code>iframes</code>) общего с этим документом источником происхождения.</li>
 <li><code>'src'</code>: (только для элемента<code> iframe</code>  с атрибутом <code>allow</code>) Функциональность доступна в этом фрейме, при условии, что загруженный в него документ происходит из того же источника, что и URL в атрибуте {{HTMLElement('iframe','src','#Attributes')}} элемента <code>iframe</code>.</li>
 <li><code>'none'</code>: Функциональность отключена как для высокоуровневых документов, так и для вложенных в него контекстов (<code>iframes</code>).</li>
 <li>&lt;origin(s)&gt;: Функциональность доступна для специфичных источников происхождения, указываемых разработчиком (к примеру, https://example.com), разделяемые между собой пробелом.</li>
</ul>

<p>Значение <code>*</code> (доступность функциональности для всех источников) или <code>'none'</code> (не доступность функциональности для всех источников), может использоваться только однократно, в то время как, значения <code>'self'</code> и <code>'src'</code> могут быть использованы с одним или несколькими источниками происхождения.</p>

<p>Каждая функциональность определяется со своим списком разрешений по умолчанию, который содержит одно из значений:</p>

<ul>
 <li><code>*</code>: Функциональность доступна по умолчанию для высокоуровневых документов и всех вложенных элементах <code> iframes</code>.</li>
 <li><code>'self'</code>: Функциональность доступна по умолчанию в документах высокого уровня и во вложенных элементах <code>iframes</code> , одного с документом источником происхождения. Функциональность не доступна в кросс-доменных документах элементов <code>iframes.</code></li>
 <li><code>'none'</code>: Функциональность по умолчанию отключена во всех браузерных контекстах.</li>
</ul>

<h2 id="Определение_политики">Определение политики</h2>

<p>Функциональная политика предлагает два способа определения политик:</p>

<ul>
 <li>Заголовок {{httpheader('Feature-Policy')}} HTTP.</li>
 <li>Атрибут {{htmlattrxref("allow", "iframe")}} на элементе {{htmlelement("iframe")}}.</li>
</ul>

<p>Основное отличие между заголовком  HTTP и атрибутом <code>allow</code>  в том, что атрибут определяет доступность функциональности для документов, загруженных в <code>iframe</code>. Заголовок же определяет доступность функциональности в документе и вложенных в него контекстах, направляющимся в ответе на HTTP(S) запрос.</p>

<h3 id="Заголовок_HTTP">Заголовок HTTP</h3>

<p>Отправить заголовок функциональной политики можно в ответе на запрос документа (страницы). Значение заголовка переопределяет политику браузера по умолчанию для данной страницы. Он имеет следующую структуру.</p>

<pre class="brush: bash">Feature-Policy: &lt;имя функциональности&gt; &lt;список разрешённых источников&gt;</pre>

<p>К примеру, для блокировки функциональности API геолокации по всему сайту:</p>

<pre class="brush: bash">Feature-Policy: geolocation 'none'</pre>

<p>Несколько функциональностей можно контролировать одновременно, отправив один HTTP заголовок, разделяющий точкой с запятой между собой список установочных директив, или отправить отдельный заголовок для каждой установочной директивы.</p>

<p>К примеру, ниже директивы идентичны:</p>

<pre class="brush: bash">Feature-Policy: unsized-media 'none'; geolocation 'self' https://example.com; camera *;

Feature-Policy: unsized-media 'none'
Feature-Policy: geolocation 'self' https://example.com
Feature-Policy: camera *;
</pre>

<h3 id="атрибут_allow">атрибут  allow </h3>

<p>Второй способ использования функциональной политики - контроль использования функциональности в документе, загруженного в элемент  <code>iframe</code></p>

<p>К примеру, для разрешения использования функциональности <code>fullscreen</code> для документа, загруженного в  <code>iframe</code> используем :</p>

<pre class="brush: html">&lt;iframe src="https://example.com..." allow="fullscreen"&gt;&lt;/iframe&gt;</pre>

<p>Эквивалентная запись:</p>

<pre class="brush: html">&lt;iframe src="https://example.com..." allow="fullscreen 'src'"&gt;&lt;/iframe&gt;</pre>

<p>Ниже, получаем доступ к геолокации пользователя документа, загруженного из указанного источника в <code>&lt;iframe&gt;</code> :</p>

<pre class="brush: html">&lt;iframe src="https://google-developers.appspot.com/demos/..."
        allow="geolocation https://google-developers.appspot.com"&gt;&lt;/iframe&gt;
</pre>

<p>Аналогично  HTTP заголовку, несколько функциональностей могут контролироваться одновременно, определяя, разделяемый точкой с запятой список установочных директив.</p>

<p>К примеру, блокируем  <code>&lt;iframe&gt;</code> для использования камеры и микрофона:</p>

<pre class="brush: html">&lt;iframe allow="camera 'none'; microphone 'none'"&gt;
</pre>

<h2 id="Наследование_политики_для_встроенного_контента">Наследование политики для встроенного контента</h2>

<p>Контексты скриптов (.js) наследуют политику их браузерных контекстов, вне зависимости от их источника происхождения. Это значит, что скрипты документа высокого уровня наследуют политику основного документа..</p>

<p>Все фреймы наследуют политику своих родительских документов. Если фрейм имеет атрибут <code>allow</code> , политики родительского документа и атрибута комбинируются, используя наиболее ограничительную политику. Для включения функциональности для фрейма, его источник происхождения должен входить в списки доступа и родительского документа, и атрибута  <code>allow</code>.</p>

<p>Отключение функциональности в политике является односторонним. Если функциональность не доступна (отключена) для дочернего фрейма его родителем, дочерний фрейм не может это отменить, и ни его потомки.</p>

<h2 id="Применение_новейших_решений_для_наилучшего_пользовательского_впечатления">Применение новейших решений для наилучшего пользовательского впечатления</h2>

<p>Трудно создать веб сайт, который использует новейшие решения и предлагает отличную производительность. Со временем, эволюционируя, сайту может даже труднее обеспечивать наилучшие пользовательские впечатления. Используйте функциональные политики для определения новейших решений, и полагайтесь на современные браузеры в предотвращении негативных изменений.</p>

<p>Существуют несколько функциональных политик, спроектированных для предоставления функциональности, но которые могут негативно влиять на впечатления пользователя. Ими являются:</p>

<ul>
 <li>Анимации, создающие разметку</li>
 <li>Неоптимизированные (слабо сжатые) изображения</li>
 <li>Переразмеренные изображения</li>
 <li>Синхронные скрипты</li>
 <li>Синхронный XMLHttpRequest</li>
 <li>Безразмерные медиа</li>
</ul>

<p>Для исключения поломки веб контента, значения по умолчанию для таких функциональных политик, позволяют функциональности быть использованной для всех источников происхождения. То есть, списком разрешений по умолчанию является <code>'*'</code> для каждой функциональности. Предотвращение использования неоптимальной функциональности, требует явного определения политики, которая отключает функциональности.</p>

<p>Для нового контента можно начать разработку с политикой, которая отключает все функциональности. Такой подход гарантирует, что ни одна из функциональностей не включена. При применении политики для существующего контента, тестирование работы наиболее желательный вариант для ожидаемой проверки работоспособности. Это особенно важно для встроенных или сторонних контентов, которых разработчик не может контролировать.</p>

<p>Для включения правоприменения всех новейших решений, определяется политика ниже.</p>

<p>Отправляйте следующий HTTP заголовок:</p>

<pre class="brush: bash">Feature-Policy: layout-animations 'none'; unoptimized-images 'none'; oversized-images 'none'; sync-script 'none'; sync-xhr 'none'; unsized-media 'none';</pre>

<p>Используя атрибут <code>allow</code> элемента <code>&lt;iframe&gt;</code>:</p>

<pre class="brush: html">&lt;iframe src="https://example.com..." allow="layout-animations 'none'; unoptimized-images 'none'; oversized-images 'none'; sync-script 'none'; sync-xhr 'none'; unsized-media 'none';"&gt;&lt;/iframe&gt;</pre>

<h2 id="Смотрите_также">Смотрите также:</h2>

<ul>
 <li><a href="/en-US/docs/Web/HTTP/Feature_Policy">Функциональная политика</a></li>
 <li>Заголовок {{HTTPHeader("Feature-Policy")}}</li>
 <li>Атрибут {{HTMLElement('iframe','allow','#Attributes')}} элемента <code>iframe</code></li>
 <li>Заголовок {{HTTPHeader("Content-Security-Policy")}} </li>
 <li>Заголовок {{HTTPHeader("Referrer-Policy")}}</li>
 <li><a href="/en-US/docs/Web/Privacy">Конфиденциальность, разрешения и информационная безопасность</a></li>
</ul>