Reputation: 131
I have a problem of cross-domain. I want to execute some request to the google maps API but I have this error "No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access." . I know there is many question about this problem but any answer helped me.
I have to do (thanks google maps API) some request to have the distance between a position and some station. It's a Spring project and I use Spring MVC.
here is my JS code:
findShorterWay = function(){
origin = document.getElementById('shorterWays').value;
if(origin){
for (var i = 0; i < stationNameArray.length; i++){
$.ajax({
url: 'https://maps.googleapis.com/maps/api/distancematrix/json?units=imperial&origins='+origin+'&destinations='+stationNameArray[i].lat+','+stationNameArray[i].lng+'&key=KEY',
data: {
sensor: false,
},
success: function (data) {
console.log(data);
}
});
}
}
}
I used IDEA functionality to create my project so I didn't used maeven or graddle.I can't use jsonp and I know that I have to change something to use CORS and change something in my server ( tomcat 8.5.5 ) but I haven't really understand how it's works. If someone can help me.
Upvotes: 2
Views: 584
Reputation: 32178
CORS headers should be set on maps.googleapis.com. I'm afraid you cannot do this and Google didn't wish to add them for some reason.
If you need to execute distance matrix calculations from the browser client side JavaScript code you have to use client side distance matrix service of Maps JavaScript API.
Otherwise you have to send HTTP requests from your server side Java code to avoid this problem.
Upvotes: 1