External images not showing in Android app - Meteor - Cordova

I am developing an Android app using Meteor and I am having problems displaying images from external sources.

The following tag <img>

should display an image from google maps api based on latitude and longitude:

<img src="http://maps.googleapis.com/maps/api/staticmap?center={{loc.lat}},{{loc.lng}}&zoom=15&size=600x300&maptype=roadmap&markers=color:blue%7C{{loc.lat}},{{loc.lng}}" />


While this works in a browser, I am getting the following error on the server when I try to run it on an android device.

XMLHttpRequest cannot load . Origin http: //meteor.local is not allowed by Access-Control-Allow-Origin.

Do I need to add the google maps api domain to some kind of "white list", for example, when working with Phonegap.

If so, how to do it in Meteor?


source to share

2 answers

Yes, starting with 1.0.4, "Meteor Cordova apps no longer allow access to all domains by default."

So now, in your file mobile-config.js

, you will need to call the App.accessRule for each external domain that you can load content from.

So, in your case add:



at the end of your file mobile-config.js

should do the trick.



Adding access rules to mobile-config.js eliminates the loading of external images in Cordova applications.

  • Create a mobile-config.js file in your project root
  • Add to App.accessRule('https://www.mycdn.com/*');

  • Build and run the app meteor run ios

This is an alternate option, I guess there might be some difference in how this is built:

  • Create a cord-build-override folder in your project root
  • Copy config.xml from .meteor / local / cordova-build to your newly created cordona correction folder
  • Add external origin servers as needed <access origin="https://www.mycdn.com/*"/>

  • Build and run the app meteor run ios

Initially I tried with browser-policy and installed BrowserPolicy.content.allowImageOrigin("https://www.mycdn.com/*");

, but apparently this is a different story?



All Articles