4

我正在尝试获取direction_in_traffic，它不是使用常规方向 api 返回的。我发现distancematrixapi 中有一个字段可以做到这一点。

当我从自己的机器上运行此代码时，它可以工作，但是一旦它在线，我会看到有关的错误Access-Control-Allow-Origin

var durationInTraffic = function(from, to, mode, callback) {
  var key = 'API-KEY';
  var address = 'https://maps.googleapis.com/maps/api/distancematrix/json?origins=' + from + '&destinations=' + to + '&key='+ key +'&travelmode=' + mode + '&departure_time=now';
  var req = new XMLHttpRequest();
  req.addEventListener('load', function(){
    if (typeof callback === 'function') {
      callback(JSON.parse(this.responseText).rows[0].elements[0].duration_in_traffic.value);
    }
  });

  req.open('GET',address);
  req.setRequestHeader('Access-Control-Allow-Origin','https://haroen.me');
  req.setRequestHeader('Access-Control-Allow-Headers','X-Requested-With');
  req.send();
};

我已经创建了密钥，但是在domain verification选项卡上它似乎“忘记”了我输入的地址。

jsbin（这显然不起作用，因为该域上不允许使用此密钥，但我在自己的域上遇到相同的错误）。

我正在尝试的完整代码可见于https://github.com/haroenv/maps-checker

谢谢你的帮助！

4

1 回答 1

0

所以正如@dandavis 在评论中建议的那样，这不起作用的原因是因为谷歌希望这个响应是服务器端的。我的解决方法如下：php将请求镜像到 Google 的（或任何服务器端解决方案）。一个示例实现是这样的：

<?php
echo file_get_contents('https://maps.googleapis.com/maps/api/distancematrix/json?origins=' . urlencode($_POST['from']) . '&destinations=' . urlencode($_POST['to']) . '&key='. urlencode(json_decode(file_get_contents('config.json'), true)['maps-key']) .'&mode=' . urlencode($_POST['mode']) . '&departure_time=now');
?>

然后我从我的主客户端脚本中向该脚本发送请求。

于 2015-12-08T09:12:27.623 回答