如何获取浏览器中权限请求弹窗（camera/geolocation等）的屏幕位置

核心结论 #

• 没有公开的Web API可以获取相机、地理位置、通知等权限请求弹窗的屏幕坐标

这类弹窗属于浏览器自身的原生UI控件，完全独立于网页DOM树，浏览器出于安全防护考虑，不会向网页暴露任何原生UI的位置、尺寸等属性，避免恶意页面利用这类信息制作仿冒钓鱼界面诱导用户操作。

且不同浏览器、不同操作系统、甚至同一浏览器的不同窗口尺寸下，权限弹窗的弹出位置都没有统一规则，无法通过固定参数实现适配。

可行的替代优化方案 #

• 按需分批次申请权限 #

不要进入页面就一次性申请所有权限，跟随用户的操作路径逐个触发权限申请，比如用户点击「扫码」按钮时再申请相机权限，点击「查看附近门店」时再申请地理位置权限，降低用户的理解成本。

• 申请前增加页面内前置引导 #

每次触发权限申请前，先在当前交互区域附近弹出自定义提示框，明确告知用户「接下来会弹出权限申请，请点击允许按钮继续使用功能」，提前给用户操作预期。
也可以通过navigator.userAgent判断当前使用的浏览器类型，显示针对性的引导：比如判断为Safari就提示「请点击地址栏左侧弹出的请求中的允许按钮」，判断为Chrome就提示「请点击地址栏右侧弹出的请求中的允许按钮」，引导用户定位到对应区域即可，不需要完全对齐弹窗坐标。

• 增加权限未授予的兜底引导 #

如果用户拒绝了权限申请，立刻在页面内显示明确的操作指引，搭配对应浏览器的权限开启步骤图示，告诉用户可以点击地址栏的权限图标手动开启权限，比申请时的指向引导效果更好。

• 通用区域指引 #

如果确实需要箭头指引，可以根据设备和浏览器类型，指向弹窗大概率出现的大致区域即可，比如桌面端浏览器基本都会把权限弹窗放在地址栏附近，只要做一个指向地址栏方向的箭头，绝大多数用户都能理解指引意图。

内容的提问来源于stack exchange，提问作者gmayc