aboutsummaryrefslogtreecommitdiff
path: root/files/ru/web/manifest/index.html
blob: c438a1f58726babac4dbadefb2b02ebccc3fa20d (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
---
title: Web App Manifest
slug: Web/Manifest
tags:
  - App
  - Manifest
  - Reference
  - Web
translation_of: Web/Manifest
---
<div>{{QuickLinksWithSubpages('/ru/docs/Web/Manifest')}}</div>

<div>{{SeeCompatTable}}</div>

<p><strong>Манифесты веб-приложений</strong> являются частью набора веб-технологий, называемых <a href="/ru/docs/Web/Apps/Progressive">прогрессивными веб-приложениями</a> (PWA, progressive web apps), представляющими собой веб-сайты, которые можно установить на домашний экран устройства без магазина приложений. В отличие от обычных веб-приложений с простыми ссылками на домашний экран или закладками, PWA можно загружать заранее и работать в автономном режиме, а также использовать обычные {{domxref('','Web API')}}.</p>

<p>Манифест веб-приложения предоставляет информацию о приложении в текстовом файле {{glossary ("JSON")}}, который необходим того, чтобы веб-приложение было загружено и отображалось пользователю аналогично нативному приложению (например, для установки на домашний экран устройства, предоставляющий пользователям более быстрый доступ и больше возможностей).</p>

<div class="hidden">
<p>Can PWA manifest contain comments?<br>
 It is a <a href="/en-US/docs/Glossary/JSON">JSON</a>-formatted file, with one exception: it is allowed to contain "<code>//</code>"-style comments.</p>
</div>

<h2 id="Deploying_a_manifest_with_the_link_tag">Содержимое манифеста</h2>

<p>Манифест может содержать следующие элементы:</p>

<p>{{ListSubpages("/ru/docs/Web/Manifest")}}</p>

<h2 id="Deploying_a_manifest_with_the_link_tag">Пример манифеста</h2>

<pre class="brush: json">{
  "name": "HackerWeb",
  "short_name": "HackerWeb",
  "start_url": ".",
  "display": "standalone",
<span class="pl-s"><span class="pl-pds">  "</span>background_color<span class="pl-pds">"</span></span>: <span class="pl-s"><span class="pl-pds">"</span>#fff<span class="pl-pds">"</span></span>,
  "description": "A simply readable Hacker News app.",
  "icons": [{
    "src": "images/touch/homescreen48.png",
    "sizes": "48x48",
    "type": "image/png"
  }, {
    "src": "images/touch/homescreen72.png",
    "sizes": "72x72",
    "type": "image/png"
  }, {
    "src": "images/touch/homescreen96.png",
    "sizes": "96x96",
    "type": "image/png"
  }, {
    "src": "images/touch/homescreen144.png",
    "sizes": "144x144",
    "type": "image/png"
  }, {
    "src": "images/touch/homescreen168.png",
    "sizes": "168x168",
    "type": "image/png"
  }, {
    "src": "images/touch/homescreen192.png",
    "sizes": "192x192",
    "type": "image/png"
  }],
  "related_applications": [{
    "platform": "web"
  }, {
    "platform": "play",
    "url": "https://play.google.com/store/apps/details?id=cheeaun.hackerweb"
  }]
}</pre>

<h2 id="Deploying_a_manifest_with_the_link_tag">Внедрение манифеста</h2>

<p>Манифест веб-приложения внедряется в вашу HTML-страницу, с помощью тега ссылки в заголовке вашего документа:</p>

<div class="highlight">
<pre><code class="language-html"><span class="nt">&lt;link</span> <span class="na">rel=</span><span class="s">"manifest"</span> <span class="na">href=</span><span class="s">"/manifest.webmanifest"</span><span class="nt">&gt;</span></code></pre>
</div>

<div class="note">
<p><strong>Note</strong>: Расширение <code>.webmanifest</code> указывается в разделе спецификации <a href="https://w3c.github.io/manifest/#media-type-registration">Media type registration</a> section of the specification (ответ файла манифеста должен возвращать <code>Content-Type: application/manifest+json</code>). Браузеры обычно поддерживают манифесты с другими соответствующими расширениями, такими как <code>.json</code> (<code>Content-Type: application/json</code>).</p>
</div>

<div class="note">
<p><strong>Note</strong>: Если для получения манифеста требуются учётные данные - атрибут <code><a href="/en-US/docs/Web/HTML/CORS_settings_attributes">crossorigin</a></code> должен иметь значение <code>"use-credentials"</code>, даже если файл манифеста находится в том же источнике, что и текущая страница.</p>
</div>

<h2 id="Заставки">Заставки</h2>

<p>В Chrome 47 и более поздних версиях заставки отображаются при загрузке веб-приложения с домашнего экрана. Эти заставки автоматически генерируются с использованием свойств, указанных в манифесте приложения, например: <code>name</code>, <code>background_color</code> и иконки в массиве <code>icons,</code> которые ближе к 128dpi для устройства.</p>

<h2 id="Спецификации">Спецификации</h2>

{{Specifications}}

<h2 id="Поддержка_браузерами">Поддержка браузерами</h2>

<div>{{Compat("html.manifest")}}</div>