CODEWITHSUNDEEP
javascriptnode.jsangulartypescript
Amit B
Amit B

Reputation: 5

Google Location API, angular 4

Angular 4: Instead of using AGM-Core module, why can't we use Google API to get the autocomplete location, If we use API to get location, I'm getting CORS issue as XHR request is only accepted in same domain(If I'm not wrong) and the solution to overcome the CORS, is that we have to use JSONP module but it is not supported by the Google API. So can anyone tell me that, how to get the location from Google API without using any third party module?

Thanks in Advance.

Edit :

Hi Shiv Kumar,

Thanks for the response.

I have actually included the meta tag in index.html, but yet the same results.

Here is my HTTP code, which I'm calling.

let url = https://maps.googleapis.com/maps/api/place/autocomplete/json?input=${location}&key='API_KEY';

return this.http.get(gooleUrl); If call from this method I'm getting cors errors.

If call through JsonP module, let url = https://maps.googleapis.com/maps/api/place/autocomplete/json?input=${location}&key='Api_key'&callback=JSONP_CALLBACK;

return this.jsonP.get(gooleUrl, {method: "GET"})

Response {_body: "JSONP injected script did not invoke callback.", status: 200, ok: true, statusText: "Ok", headers: Headers, …} headers: Headers {_headers: Map(0), _normalizedNames: Map(0)} ok: true status: 200 statusText: "Ok" type: 3 url: "https://maps.googleapis.com/maps/api/place/autocomplete/json?input=w&key='Api_key Which i removed'&callback=ng_jsonp.req0.finished" _body: "JSONP injected script did not invoke callback." __proto: Body

Upvotes: 0

Views: 172

Answers (1)

Shiv Kumar Baghel
Shiv Kumar Baghel

Reputation: 2480

try below CSP meta tag in your HTML to allow googleapis calls

<meta http-equiv="Content-Security-Policy" 
"script-src 'self' https://*.googleapis.com https://*.gstatic.com; 
object-src 'self'">

Upvotes: 0

Related Questions