Angularjs googleMap API json Uncaught Syntaxerror: Unerwarteter token:

Question

Rot I alle bisherigen Beiträge: * i hinzugefügt: & Rückruf = JSON_CALLBACK * i auch einfach versucht $ http.get führt aber zu: "Zugang -Control-Allow-Origin ' * i auch zu definieren jsonpCallbackParam versucht zu' json_callback 'von nur Rückruf und hinzugefügt Format: 'JSONP' * auch eine Dokumentation über $ sce.trustAsResourceUrl zu lesen versucht (url) (naja ich habe nicht viel verstanden :-( Auf F12 -> source, sehe ich, dass die erforderlichen Daten zurückgegeben werden, aber auf dem Konsolenprotokoll bekomme ich Uncaught SyntaxError: Unexpected token.

bitte raten

var autoJsonpUrl = 'https://maps.googleapis.com/maps/api/distancematrix/json?region=il&origins=tel-aviv&destinations=jerusalem&key=AIzaSyD3xhn92KwStkZAg-rZueAFI1LooRLpND0' + '&callback=JSON_CALLBACK'; 

var options = 
{ 
    jsonpCallbackParam: 'json_callback', 
    cache: false 
}; 

$http.jsonp(autoJsonpUrl, options).then(function (response) { 
    console.log(response); 
}); 

Answer 1

Endpoint http://maps.googleapis.com/maps/api/distancematrix/ nicht JSONP nicht unterstützt, stattdessen könnte man bedenkt, nutzen Google Maps JavaScript API wie unten gezeigt:

angular.module('mapApp', []) 
 

 
    .controller("mapCtrl", function ($scope, $http) { 
 
     $scope.routeInfo = null; 
 
     var distanceMatrix = new google.maps.DistanceMatrixService(); 
 
     var distanceRequest = { region: "il", origins: ["tel-aviv"], destinations: ["jerusalem"], travelMode: google.maps.TravelMode.DRIVING, unitSystem: google.maps.UnitSystem.METRIC}; 
 
     distanceMatrix.getDistanceMatrix(distanceRequest, function (response, status) { 
 
      if (status != google.maps.DistanceMatrixStatus.OK) { 
 
       console.log('An error occured: ' + status); 
 
      } 
 
      else { 
 
       $scope.$apply(function(){ 
 
        $scope.routeInfo = response;  
 
       }); 
 
       
 
      } 
 
     }); 
 
     
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular.min.js"></script> 
 
<script src="https://maps.google.com/maps/api/js"></script> 
 
<script src="app.js"></script> 
 

 
<div ng-app="mapApp" ng-controller="mapCtrl"> 
 
    <pre>{{routeInfo | json}}</pre> 
 
</div>