XMLHttpRequest error in application
I am trying to run a simple simulation example in my mobile app using Ionic framework and Parse.com. The code is simple:
Parse.initialize(APP_KEY, JS_KEY);
Parse.User.signUp("my.user", "123456", {}, {
success: function(user) {
// Hooray! Let them use the app now.
console.log('yuhuuu ' + user)
},
error: function(user, error) {
// Show the error message somewhere and let the user try again.
alert("Error: " + error.code + " " + error.message);
}
});
This code works when I test it in my browser, but when I run it on my mobile I get an error code 100
with the following message:
I've already tried changing the way I'm chanting (use this object instead of direct user and password access). It also checks to see if the Android app has the appropriate permissions to access web resources (this is fine).
source to share
After digging a little deeper, I found a link that brought my attention to the root cause of my problem. Cordova (one of the underlying Ionic frameworks) restricts requests to only local resources ( file://
), which causes all external requests to fail.
To rewrite this behavior, you need to use the whitelist plugin and configure it so you can use your desired api server.
This can be achieved in the following way.
First add the plugin to your project.
cordova plugin add https://github.com/apache/cordova-plugin-whitelist.git
Then set up your backend to whitelist in the file config.xml
.
<allow-intent href="*://*api.parse.com/*"/>
source to share