Web 应用清单
根据Web 应用清单规范定义的**Web 应用清单**是一个JSON文本文件,提供有关 Web 应用程序的信息。
Web 应用清单最常见的用途是提供浏览器安装设备上的渐进式 Web 应用 (PWA)所需的信息,例如应用的名称和图标。
Web 应用清单包含一个 JSON 对象,其中顶级键称为成员。
成员
本节列出了清单中可能出现的成员。
规范中所有成员都是可选的,但某些应用程序需要某些成员存在。例如,PWA 必须提供某些清单成员。
- background_color
- categories
- description
- display
- display_override
- file_handlers
- icons
- id
- launch_handler
- name
- orientation
- prefer_related_applications
- protocol_handlers
- related_applications
- scope
- screenshots
- serviceworker
- share_target
- short_name
- shortcuts
- start_url
- theme_color
注意:dir
、lang
、iarc_rating_id
和note_taking
成员未实现。
清单示例
json
{
"short_name": "MDN",
"name": "MDN Web Docs",
"icons": [
{
"src": "/favicon-192x192.png",
"sizes": "192x192",
"type": "image/png"
},
{
"src": "/favicon-512x512.png",
"sizes": "512x512",
"type": "image/png"
}
],
"start_url": ".",
"display": "standalone",
"theme_color": "#000000",
"background_color": "#ffffff"
}
部署清单
Web 应用清单使用文档<head>
中的<link>
元素部署在 HTML 页面中
html
<link rel="manifest" href="manifest.json" />
.webmanifest
扩展名在规范的媒体类型注册部分中指定(清单文件的响应应返回Content-Type: application/manifest+json
)。浏览器通常支持具有其他适当扩展名的清单,例如.json
(Content-Type: application/json
)。
如果清单需要凭据才能获取,则必须将crossorigin
属性设置为use-credentials
,即使清单文件与当前页面位于同一来源。
html
<link rel="manifest" href="/app.webmanifest" crossorigin="use-credentials" />
启动画面
在某些浏览器和操作系统中,启动已安装的 PWA 时会显示启动画面。此启动画面是自动生成的,其外观由 Web 应用清单中的成员定义,具体来说是
浏览器兼容性
BCD 表仅在启用 JavaScript 的浏览器中加载。