Web App Manifest：orientation 支持

清单成员 orientation 设置已安装 Web 应用启动及运行时的默认屏幕方向，例如 portrait 或 landscape，除非页面自身在运行时锁定了不同的方向。

浏览器与生态支持

• 图例
• 支持
• 部分支持
• 需开启标志
• 不支持
• 未知

浏览器 / 平台	支持	版本	置信度	来源	备注
Chrome (Desktop)	支持	39	高	来源	—
Chrome (Android)	支持	39	高	来源	1
Edge (Desktop)	支持	79	高	来源	2
Firefox (Desktop)	不支持	—	高	来源	3
Firefox (Android)	支持	79	高	来源	—
Safari (macOS)	不支持	—	高	来源	4
Safari (iOS)	不支持	—	高	来源	56
Samsung Internet	支持	4.0	高	来源	7
WebView (Android)	支持	39	高	来源	8

1. 由 browser-compat-data 镜像自 Chrome 的数据推导。
2. 由 browser-compat-data 镜像自 Chrome 的数据推导。
3. browser-compat-data 未记录 Firefox 的支持。
4. browser-compat-data 未记录 Safari 的支持。
5. browser-compat-data 未记录 iOS 版 Safari 的支持。
6. 由 browser-compat-data 镜像自 Safari 的数据推导。
7. 由 browser-compat-data 镜像自 Chrome Android 的数据推导。
8. 由 browser-compat-data 镜像自 Chrome Android 的数据推导。

源数据: /compatibility/manifest-orientation.json · 全球使用占比: 74 % (StatCounter 2026-05)

来源: 规范 · MDN · 最近核验 2026-10-03 · 置信度: 高 (由来源计算)

如何使用

在 Web 应用清单中使用规范定义的关键字值声明该成员：

{
  "name": "Field Notes",
  "start_url": "/",
  "display": "standalone",
  "orientation": "portrait"
}

如何在运行时检测

MDN 另外记录了 Screen Orientation API，可以在调用其 lock() 方法前先做 特性检测：

function supportsOrientationLock() {
  return 'orientation' in screen && typeof screen.orientation.lock === 'function';
}

async function lockLandscape() {
  if (!supportsOrientationLock()) return;
  try {
    await screen.orientation.lock('landscape');
  } catch {}
}

实践清单

• 根据规范，orientation 为 Web 应用的所有顶层可遍历上下文（top-level traversables）设置默认方向；某个请求值是否被支持，取决于用户代理是否 遵循它。
• 根据 MDN 的说明，若省略该成员或设置了无效值，应用通常会使用设备的自然 方向，以及任何用户或系统级的方向设置。
• 根据规范，用户代理可以支持清单 orientation 成员而不实现另一个独立的 Screen Orientation API——两者是相互独立的能力。
• 省略 orientation 是合法的——根据 MDN 的说明，适配两种方向都能良好工作的 应用可以直接省略该成员。

下一步

• Web App Manifest: display
• Web App Manifest: icons / maskable

← 返回兼容性浏览器。