$http get Access-Control-Allow-Origin


#1

There is nothing to explain too much

	$http({method: 'GET', url: "https://maps.googleapis.com/maps/api/place/autocomplete/json",
		params : {input:$scope.modelAddressSearch.input, language:$translate.instant('LangMap'), key:"THE_KEY"},
		headers: { 'Content-Type': 'Access-Control-Request-Headers' }
	}).success(function(data, status){
	console.log(data);
		$scope.resultsSearch = data;
	}).finally(function(){
		$rootScope.SpinnersLoading = false;
	});

Error:

XMLHttpRequest cannot load https://maps.googleapis.com/maps/api/place/autocomplete/json?input=xchj&key=THE_KEY&language=en. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost' is therefore not allowed access. 

#2

Maybe its because you have not set THE_KEY api key, or because you are trying it to do it on localhost which im not 100% sure that can be done. Try to upload your code to a site and try it there.


#3

@kfir
I think Access-Control-Request-Header is not a value for Content-Type. It is an own key :wink:

headers: {
  'Access-Control-Allow-Origin': '*'
}

#4

run chrome via command prompt using:

your path to chrome --disable-web-security


#5

Thanks for the help,
I sent a request to my server and then to Google


#6

what is the solution for this problem ?