navigator.permissions.query() 是查询权限状态的唯一标准方式，返回 Promise 解析为 PermissionStatus 对象，state 值为 'granted'、'denied' 或 'prompt'，需传 { name: 'xxx' } 且仅支持规范定义的权限类型。

怎样用 navigator.permissions.query() 查当前权限状态

直接调用 navigator.permissions.query() 是唯一标准方式，它返回一个 Promise，解析为 PermissionStatus 对象。注意：不是所有权限都支持查询，只限明确列入 Permissions API 规范的类型，比如 'geolocation'、'notifications'、'camera'、'microphone'、'clipboard-read' 等。

常见错误是传入非法字符串（如 'localStorage' 或 'cookie'），会直接 reject 并抛出 TypeError: Invalid permission name。

• 必须传 { name: 'xxx' } 形式，不能只传字符串
• 'geolocation' 在大多数浏览器中可查；但 'background-sync' 或 'periodic-background-sync' 在 Safari 中不支持，调用会 reject
• 首次查询未授权的权限时，Chrome 可能触发一次用户提示（取决于上下文是否 secure + user gesture）

navigator.permissions.query({ name: 'geolocation' })
  .then(status => {
    console.log(status.state); // 'granted', 'denied', or 'prompt'
    status.onchange = () => console.log('权限状态变了：', status.state);
  })
  .catch(err => console.error('查权限失败：', err));

PermissionStatus.state 的三个值到底代表什么

state 不是布尔值，而是字符串：'granted'、'denied'、'prompt'。它们和实际行为强相关，但容易误解：

HTML Extract

使用 MinerU 从 HTML 页面和文件中提取内容，将 HTML 转换为保持标题、列表、表格及文本层次结构的干净、结构化 Markdown。F...

下载

• 'granted'：已明确授权，后续调用对应 API（如 navigator.geolocation.getCurrentPosition()）不会弹窗
• 'denied'：用户点过「拒绝」或浏览器策略禁用（如隐身模式下默认拒 notifications），此时再调原始 API 会直接报错（如 NotAllowedError）
• 'prompt'：尚未授予权限，也未拒绝——但不等于「下次调用就会弹窗」。例如在非 secure 上下文（HTTP 页面）查 geolocation，state 永远是 'prompt'，但调用时直接失败，不会弹窗

为什么 navigator.permissions.query() 在某些浏览器里不工作

根本原因是兼容性断层：Safari 直到 iOS 16.4 / macOS Ventura 13.3 才开始部分支持（仅 'geolocation' 和 'notifications'），且 onchange 事件基本不可靠；Firefox 对 'camera'/'microphone' 的支持从 v115 起才稳定。

立即学习“前端免费学习笔记（深入）”；

• 查 'clipboard-write' 前，先确认是否在用户手势（如 click）回调中执行，否则 Chrome 会静默拒绝
• Service Worker 中无法使用 navigator.permissions（没有 navigator 实例）
• iframe 里查权限受 allow="geolocation; camera" 属性限制，缺失对应 allow 值会导致 query() reject

查权限 ≠ 能用 API：别跳过实际调用验证

权限状态只是参考，真实可用性必须通过实际调用验证。比如 state === 'granted' 时，navigator.clipboard.readText() 仍可能因页面未聚焦而失败；又比如 state === 'prompt' 时，在 iframe 且无 allow 属性下，调用直接 throw SecurityError。

• 对 'notifications'，即使 state 是 'granted'，也要 catch Notification.requestPermission() 的 Promise，因为系统级通知开关可能关闭
• 'camera' 查询返回 'granted'，不代表设备存在——仍需处理 enumerateDevices() 返回空列表的情况
• 不要缓存 PermissionStatus 对象太久，它的 state 会随系统设置变更，但 onchange 未必触发（尤其跨 tab）

权限查询逻辑本身轻量，但背后绑定的是浏览器策略、系统设置、上下文安全性和用户交互历史。最常被忽略的，是把 state === 'prompt' 当作“安全可调用”的信号——实际上它只是“还没被明确拒绝”，离真正可用还差一步用户动作或策略校验。