我之前开发时也碰到过Firefox这个让人头疼的权限弹窗问题，结合你的代码和描述，大概率是以下几个原因导致的，给你整理了对应的解决方案：

1. 检查页面是否处于安全上下文（HTTPS/localhost） #

Firefox对地理位置API的权限策略比其他浏览器更严格：只有在HTTPS协议或者localhost（本地开发）环境下，才会持久化你选择的权限设置。如果你的页面是HTTP协议（比如部署在非HTTPS服务器，或者本地用IP地址访问），哪怕你点击了"允许"，每次调用getCurrentPosition时，Firefox都会重新弹出权限请求框。

解决办法： #

• 生产环境：将网站部署到HTTPS服务器上；
• 本地开发：使用http://localhost访问你的页面（不要用127.0.0.1或者本地IP），Firefox会把localhost视为安全上下文，记住你的权限选择。

2. 检查getLocation函数的调用频率 #

如果你的代码中频繁触发了getLocation（比如页面加载时重复调用、或者在某个循环/定时器里反复执行），即使权限已经允许，也会导致Firefox反复弹窗。

解决办法： #

确保getLocation只在用户主动触发时调用一次（比如绑定到按钮点击事件），而不是自动重复执行。比如修改你的代码，把调用逻辑绑定到按钮：

var x = document.getElementById("demo");
// 给按钮绑定点击事件，用户主动触发位置获取
document.getElementById("location-btn").addEventListener("click", getLocation);

function getLocation() {
  if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(showPosition, showError);
  } else {
    x.innerHTML = "Geolocation is not supported by this browser.";
  }
}

function showPosition(position) {
  x.innerHTML = `Latitude: ${position.coords.latitude}<br>Longitude: ${position.coords.longitude}`;
}

// 添加错误处理，方便排查问题
function showError(error) {
  switch(error.code) {
    case error.PERMISSION_DENIED:
      x.innerHTML = "你拒绝了位置权限请求";
      break;
    case error.POSITION_UNAVAILABLE:
      x.innerHTML = "无法获取位置信息";
      break;
    case error.TIMEOUT:
      x.innerHTML = "获取位置请求超时";
      break;
    default:
      x.innerHTML = "发生未知错误";
  }
}

3. 若需要持续获取位置，改用watchPosition #

如果你需要实时更新用户位置，不要反复调用getCurrentPosition，而是使用navigator.geolocation.watchPosition。这个方法只会请求一次权限，之后会自动监听位置变化并返回更新，不会重复弹窗。

示例代码：

function watchUserPosition() {
  if (navigator.geolocation) {
    navigator.geolocation.watchPosition(showPosition, showError);
  }
}

按上面的方法排查后，Firefox的权限弹窗问题应该就能解决了。

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