Madeline
Madeline

Reputation: 645

Meteor mobile application seemingly not loading outside assets

Here is my issue, I am using Bootstrap (twbs:bootstrap), font-awesome (natestrauser:font-awesome) and Avatar (utilities:avatar).

When I load my application in a desktop browser, all assets load fine.

When I load my application in a mobile browser, all assets load fine.

But when I load my application in the compiled (Android) app, font-awesome and Avatar don't load their assets. The reason I am targeting them is they are both reliant on contacting outside sources. font-awesome is served off of a CDN and Avatar retrieves avatars from social networks. I know I can package font-awesome but I can't do the same for avatars so I need to figure this out.

I have looked to see if Meteor does something odd like sandboxing the app to prevent outside contact but I can't seem to find any mention of these kinds of issues. Is there a default security settings that I can set where it would allow my app to 'contact' whitelisted sites? It would be absurd but it is Meteor after all.

I figure someone more knowledgeable in Meteor can point out my error.

There is no code for font-awesome (besides using CSS classes) and there is really no specific code for Avatar besides {{> avatar ... }}

Thank you in advance!

Upvotes: 0

Views: 117

Answers (1)

Madeline
Madeline

Reputation: 645

Note, as of 5/30/2017: Please skip to EDIT 2 below unless you want to read the very long and confusing ramblings of my former self. Thank you.

Okay, I was right but not necessarily right about who was causing what (I was kind of right). The reasoning behind it makes sense so I am thankful for that.

Here is what I've determined. Cordova has a whitelist under /res/config.xml where URLs are whitelisted and only those URLs are the only URLs allowed outside of the application.

But, if you try to edit config.xml it will be overwritten by Meteor on build which indicates this config is governed / overwritten by Meteor.

I searched around and found a few things: Meteor / Cordova, Meteor. The second article gives the solution. You must use the package browser-policy to whitelist what URLs you want.

After installing browser-policy, you must include them in a file in /server. I tried installing them inside a if(Meteor.isServer) block outside of /server but it didn't work.

Hope this helped! I couldn't find anything similar to this and I presume others will run into this road block as well

EDIT: This will only fix it for desktop. For my issue, I had to create a top-level file called mobile-config.js and use config settings from this page to whitelist URLs. This change happened in Meteor 1.0.4

EDIT 2:

Here is it said more clearly: You must whitelist all outside URLs that you want to contact inside of mobile-config.js

For instance, if you want to contact google.com from your mobile app, you would add

App.accessRule('https://www.google.com')

Thankfully Meteor has fixed their extreme documentation issue and has now included this on the official documentation here

Upvotes: 1

Related Questions