Question

我正在尝试将Better Doctor API用于学校项目。

这是API调用的网址：

var resource_url =＆＃39; https://api.betterdoctor.com/2016-03-01/doctors?location=＆＃39; + 坐标 +＆＃39;，＆＃39; +距离+＆＃39;＆amp; skip = 0＆amp; limit = 10＆amp; user_key =＆＃39; + api_key;

坐标必须采用格式＆＃39; xx.xxx，-xx.xxx＆＃39; （没有空格）作为lat，-lon值。我想使用navigator.geolocation函数自动获取用户的位置并将其存储在变量坐标中，而不是硬编码特定的坐标。

我这样做的方式是返回未定义的坐标。我在下面的例子中注释了它。我对javascript和新闻都很新，所以如果问题含糊不清或措辞不好，请原谅。谢谢。这就是我所拥有的：

＆＃13;

var api_key = 'CODE_SAMPLES_KEY_9d3608187'; 

var coordinates = "40.7128,-74.006"; //NY City coordinates

var distance = 30; //Want to toggle this

//var coordinates = getLocation(); Doesn't work
//getLocation() is defined below


function showPosition(position) {

console.log("Position: " + String(position.coords.latitude).slice(0, 6) + "," + String(position.coords.longitude).slice(0, 7));

  return String(position.coords.latitude).slice(0, 6) + "," + String(position.coords.longitude).slice(0, 7);

}

function getLocation() {
  if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(showPosition);

  } else {
    alert("Geolocation is not supported by this browser.");
  }
}

var resource_url = 'https://api.betterdoctor.com/2016-03-01/doctors?location=' + coordinates + ',' + distance + '&skip=0&limit=10&user_key=' + api_key;

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>

＆＃13;

##

Answer 1

有两个可能的原因，您没有获得地理位置信息。

getCurrentPosition()不再适用于不安全的起源（HTTP站点）。如果您的JavaScript代码在HTTP网站上运行，而不是HTTPS，getCurrentPosition()将无声地失败。
getCurrentPosition()只能通过用户手势事件调用（点击内容等）。如果在加载页面后自动调用getLocation()，则无法正常工作。

我认为这两个限制都是出于安全考虑。

对于您的代码段，这是jsfiddle中的一个工作示例。

无法在react.js中的变量中存储navigator.geolocation

1 个答案: