Ошибка (Доступ к заголовкам) при отправке запроса AJAX для получения указаний Google Maps

Question

Ошибка (Доступ к заголовкам) при отправке запроса AJAX для получения указаний Google Maps

0

Я пытаюсь использовать API-интерфейсы Google Maps, чтобы получить указания, и я получаю сообщение об ошибке:

В запрошенном ресурсе нет заголовка "Access-Control-Allow-Origin". Следовательно, для источника " http://irfanknow.com " не разрешен доступ.

Я пробовал использовать https - это протокол и jsonp в качестве типа данных, но, похоже, они не исправляют его. Что я делаю не так?

Вот мой код:

$.ajax({
    url: 'https://maps.googleapis.com/maps/api/directions/json?origin='+encodeURI(from)+'&destination='+encodeURI(to)+'&key=AIzaSyA-DmsaUVTWZgzqd43J5lMWIgUcIiIfIlo',
    dataType: 'json',
    jsonp: 'callback',
    method: 'GET',
    success: function(directionsResults){
        console.log(directionsResults);
                            }
                                            });

wordSmith 04 окт. 2014, в 23:16

Источник

0

Направление-веб-сервис не подходит для использования через ajax, используйте вместо этого javascript-API .
Dr.Molle 04 окт. 2014, в 21:15
0

@Dr.MolleDr.Molle Нужно ли включать библиотеку или делать что-то кроме того, чтобы включить API в консоли, чтобы заставить его работать?
wordSmith 05 окт. 2014, в 00:03

Теги:

javascript

jquery

google-maps

google-maps-api-3

1 ответ

Ещё вопросы

Направление-веб-сервис не подходит для использования через ajax, используйте вместо этого javascript-API .
@Dr.MolleDr.Molle Нужно ли включать библиотеку или делать что-то кроме того, чтобы включить API в консоли, чтобы заставить его работать?

wordSmith · Accepted Answer · 2014-10-04T21-24-00.000Z

После включения API-интерфейсов и чтения документации (https://developers.google.com/maps/documentation/javascript/directions) можно сделать что-то вроде этого. Это устанавливает центр карты в Чикаго и дает указания от Чикаго до Бостона.

var directionsDisplay;
var directionsService = new google.maps.DirectionsService();
var map;

function initialize() {
  directionsDisplay = new google.maps.DirectionsRenderer();
  var chicago = new google.maps.LatLng(41.850033, -87.6500523);
  var mapOptions = {
      zoom:7,
      center: chicago
    }
    map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);
    directionsDisplay.setMap(map);
  }

  function calcRoute() {
  var start = 'Chicago';
  var end = 'Boston';
  var request = {
      origin:start,
      destination:end,
      travelMode: google.maps.TravelMode.DRIVING
  };
      directionsService.route(request, function(result, status) {
          if (status == google.maps.DirectionsStatus.OK) {
              directionsDisplay.setDirections(result);
          }
      });
}

Огромное спасибо. Это означает, что этот API developers.google.com/maps/documentation/directions не поддерживает сценарии на стороне клиента из-за несовместимости с XSS (например, заголовки ответа на стороне сервера «Access-Control-Allow-Origin *» или функциональность JSONP). Поэтому нам нужно использовать JavaScript API ( developers.google.com/maps/documentation/javascript/directions ). Странно: API геокодирования developers.google.com/maps/documentation/geocoding поддерживает сценарии на стороне клиента, поскольку сервер отвечает заголовком «Access-Control-Allow-Origin *».