CODEWITHSUNDEEP
androidcordovagoogle-mapsionic-framework
Sharad Biradar
Sharad Biradar

Reputation: 2074

Ionic Framework: Not loading google maps library on device

I am trying to implement Google maps in ionic app. The map library is loading on web browser but throwing 404 on device.

To implement maps I have installed "whitelist" and "geolocation" plugins as below:

ionic plugin add https://github.com/apache/cordova-plugin-whitelist.git

ionic plugin add cordova-plugin-geolocation

Also, added access origin="*" to config.xml. Please, help me in this regard.

Thank you.

Upvotes: 2

Views: 3325

Answers (1)

Gajotres
Gajotres

Reputation: 57309

Whitelist plugin alone is not enough. You will also need to use an appropriate security meta tag, mentioned in the official whitelist plugin documentation.

But there's one thing missing from that documentation. This meta tag must be adjusted to specific needs, in this case for Google Maps V3 API.

This is a required meta tag I can confirm works with Google Maps:

<meta http-equiv="Content-Security-Policy" content="default-src *; script-src 'self' 'unsafe-inline' 'unsafe-eval' *; style-src  'self' 'unsafe-inline' *">

If you need more references you can find them in my blog article on this topic:

http://www.gajotres.net/using-cordova-geoloacation-api-with-google-maps-in-ionic-framework/

I can even send you a working example.

Upvotes: 3

Related Questions