Получение Нет 'Access-Control-Allow-Origin' Angular 2

Question

В частности, я делаю запрос get к матрице расстояний google api, но не получаю "Access-Control-Allow-Origin".

this.http.get(googleApiurl).map(response => response.json()).subscribe(
    //Code here
);

Поскольку этот заголовок является заголовком ответа, а не заголовком запроса, я попытался:

In constructor->private res: ResponseOptions
this.res.headers.append('Access-Control-Allow-Origin','*');

Ты можешь помочь мне?

Answer 1

Я бы предложил вам запросить API Google на вашем сервере. Однако, если вы не хотите настраивать сервер, есть некоторые обходные пути.

Решение 1:

Я столкнулся с той же проблемой и исправил ее с помощью PlacesService, чтобы получить PlaceID

// Get Place ID from Address 
function getPlaceIDFromAddress(address, callback){
          var place = {};
          var request = {
            location: new google.maps.LatLng(myLat, myLng),
            radius: '50',
            query: address
          };
          var service = new google.maps.places.PlacesService($scope.mapContainer);
          service.textSearch(request, function(results, status){
             if (status == google.maps.places.PlacesServiceStatus.OK) {     
                    var placeId = results[0].place_id;
                    var location = results[0].geometry.location;                    
                return callback(null, placeId);
              }
          });
    }

затем передайте PlaceID в геокодер, чтобы получить LatLng, или вы можете передать LatLng в GeoCode, чтобы получить адреса.

(new google.maps.Geocoder()).geocode({placeId: places_id}, function(results, status) {
  if (status == google.maps.GeocoderStatus.OK) {
     console.log("Address: ", results[0].formatted_address);
}});

Решение 2:

Не рекомендуется, хотя.

Если вы просто хотите проверить на своем локальном хосте, вы можете установить это расширение Chrome. Просто включите его, прежде чем звонить в матрицу API

Это расширение вставит "Access-Control-Allow-Origin" в заголовок.