Web 应用清单

Web 应用清单规范中定义的 Web 应用清单是一个 JSON 文本文件，提供有关 Web 应用的信息。

¥A web application manifest, defined in the Web Application Manifest specification, is a JSON text file that provides information about a web application.

Web 应用清单最常见的用途是提供浏览器在设备上安装渐进式网络应用 (PWA) 所需的信息，例如应用的名称和图标。

¥The most common use for a web application manifest is to provide information that the browser needs to install a progressive web app (PWA) on a device, such as the app's name and icon.

Web 应用清单包含单个 JSON 对象，其中顶层键称为成员。

¥A web application manifest contains a single JSON object where the top-level keys are called members.

会员

¥Members

本节列出了可能出现在清单中的成员。

¥This section lists the members that may appear in the manifest.

所有成员在规范中都是可选的，但某些应用要求某些成员存在。例如，PWA 必须提供某些清单成员。

¥All members are optional in the specification, but some applications require some members to be present. For example, PWAs must provide certain manifest members.

注意：dir、lang、iarc_rating_id 和 note_taking 成员未实现。

¥Note: The dir, lang, iarc_rating_id, and note_taking members are not implemented.

清单示例

¥Example manifest

json

{
  "name": "HackerWeb",
  "short_name": "HackerWeb",
  "start_url": ".",
  "display": "standalone",
  "background_color": "#fff",
  "description": "A 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": "play",
      "url": "https://play.google.com/store/apps/details?id=cheeaun.hackerweb"
    }
  ]
}

部署清单

¥Deploying a manifest

Web 应用清单使用文档 <head> 中的 <link> 元素部署在 HTML 页面中：

¥Web app manifests are deployed in your HTML pages using a <link> element in the <head> of a document:

html

<link rel="manifest" href="manifest.json" />

.webmanifest 扩展名在规范的媒体类型注册部分中指定（清单文件的响应应返回 Content-Type: application/manifest+json）。浏览器通常支持具有其他适当扩展名的清单，例如 .json (Content-Type: application/json)。

¥The .webmanifest extension is specified in the Media type registration section of the specification (the response of the manifest file should return Content-Type: application/manifest+json). Browsers generally support manifests with other appropriate extensions like .json (Content-Type: application/json).

如果清单需要凭据才能获取，则 crossorigin 属性必须设置为 use-credentials，即使清单文件与当前页面同源。

¥If the manifest requires credentials to fetch, the crossorigin attribute must be set to use-credentials, even if the manifest file is in the same origin as the current page.

html

<link rel="manifest" href="/app.webmanifest" crossorigin="use-credentials" />

启动画面

¥Splash screens

在某些浏览器和操作系统中，启动已安装的 PWA 时会显示启动屏幕。此启动屏幕是自动生成的，其外观由 Web 应用清单中的成员定义，具体来说：

¥In some browsers and operating systems, a splash screen is displayed when an installed PWA is launched. This splash screen is automatically generated and its appearance is defined by members in the web app manifest, specifically:

浏览器兼容性

BCD tables only load in the browser

¥Browser compatibility

也可以看看

¥See also

渐进式 Web 应用 (PWA)