点击后调用 getCurrentPosition() 报 NotAllowedError 的根本原因是违反浏览器安全策略：非 HTTPS 环境、非用户手势触发、用户已拒绝权限或 WebView 未启用定位；需确保 HTTPS、显式交互启动，并用 Permissions API 安全查询状态。
浏览器中无法直接“获取” geolocation 权限，只能触发用户授权请求；调用 navigator.geolocation.getCurrentPosition() 是唯一合规入口，且必须在用户交互（如点击）后执行。
为什么点击后调用 getCurrentPosition() 仍报错 NotAllowedError？
这是最常见的权限拒绝表现，根本原因不是代码写错，而是调用时机或上下文不满足浏览器安全策略：
- 页面未通过 HTTPS 提供（本地
file://协议或 HTTP 站点下，Chrome/Firefox/Safari 均会静默拒绝） - 调用不在用户手势事件内（比如在
setTimeout、fetch回调、DOMContentLoaded中直接调用） - 用户此前已明确拒绝过该站点权限，且未在浏览器设置中重置（此时不会弹窗，直接走
error回调） - 某些 Android WebView 或旧版 iOS WKWebView 未启用定位能力（需检查原生层配置）
如何正确触发权限请求并处理不同结果？
必须用用户可感知的交互启动，例如按钮点击，并显式处理成功、失败、超时三种路径：
document.getElementById('get-location-btn').addEventListener('click', () => {
navigator.geolocation.getCurrentPosition(
(pos) => {
console.log('经纬度：', pos.coords.latitude, pos.coords.longitude);
},
(err) => {
if (err.code === err.PERMISSION_DENIED) {
console.warn('用户拒绝了定位权限');
} else if (err.code === err.POSITION_UNAVAILABLE) {
console.warn('位置服务不可用（如关机、飞行模式）');
} else if (err.code === err.TIMEOUT) {
console.warn('定位请求超时');
}
},
{ enableHighAccuracy: false, timeout: 5000, maximumAge: 30000 }
);
});
注意：enableHighAccuracy 设为 true 会强制使用 GPS，在室内常导致超时；timeout 建议设为 5–10 秒，避免长时间白屏；maximumAge 可复用缓存位置，减少重复请求耗电。
怎样判断用户是否已授予权限，而不触发弹窗？
现代浏览器支持 Permissions API 查询状态，但仅对 geolocation 有效，且返回值受当前上下文限制：
- 若页面是 HTTPS + 用户已授予权限 → 返回
'granted' - 若未授权或拒绝过 → 返回
'prompt'或'denied'（取决于是否曾弹窗） - 若在非安全上下文（HTTP）→ 抛出
SecurityError异常
安全写法：
async function checkGeolocationPermission() {
if (!navigator.permissions) return 'unsupported';
try {
const status = await navigator.permissions.query({ name: 'geolocation' });
return status.state; // 'granted', 'denied', 'prompt'
} catch (e) {
return 'error';
}
}
真正难的不是调用函数，而是应对用户拒绝后的降级方案——比如提供手动输入城市、IP 地理粗略定位、或延迟到下次点击再试。权限状态会随时间、浏览器策略、用户操作变化，任何“一次判断永久有效”的假设都会出问题。
