moerphy
moerphy

Reputation: 23

Issues with ajax request (Cordova)

i have some issues with outgoing requests in my cordova app. neither ajax request's are working, nor i can include images like this: <img src="http://www.bing.com/s/a/hpc14.png">.

config.xml:

<plugin name="cordova-plugin-whitelist" version="1" />

<access origin="*" />

<allow-navigation href="*" />
<allow-intent href="*" />

<content src="index.html" />

app.js:

$.ajax({
    url: "http://domain.xyz",
    type: "post",
    data: { "uuid": device.uuid },
    dataType: "json",
    success: function(json){
        alert('it works');
    },
    error: function(e){
        alert("status: "+e.status);
    }
});

this returns alway status: 0

can you help me?

Upvotes: 1

Views: 1298

Answers (2)

user3255670
user3255670

Reputation:

@moerphy,
both the previous answer are correct. There are three (3) items to set with the new security policies. HOWEVER, if you set your version so something below 4.0.0 then you do not have to worry about the security policy. The three (3) items are:

  • white-list
  • white-list plugin
  • CSP

Also, I hope your example is just that. It is bad practice to store the APP assets (images, css files, etc) on a remove server. Store ALL the assets that you can locally.

In any case, you want to read. Top Mistakes by Developers new to Cordova/Phonegap
Make sure to read:

    1. Not setting the "phonegap version" for your compiler
    1. Not adding the new "white-list", "white-list plugin" parameters in config.xml AND "Content Security Policy"
    1. You need to get your plugins from NPM now.

I QUOTE 6. so I can encourage you to look:

With the CLI version, if you do not assign a version for your platform OR in ''Phonegap Build'' if you do not set the phonegap-version in config.xml, YOU WILL GET THE LATEST VERSION. If you are lucky, your program just works as expected. If you are not lucky, you'll get a set of cascading error.

Upvotes: 0

Simon Prickett
Simon Prickett

Reputation: 4123

If you are using Cordova 5 and the device and server can see each other you likely have to enable this with the content security policy. See Cordova Whitelist Plugin. You want to consider adding a meta tag to

Example configuration would look like:

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

Depending on what else your app does or doesn't do you may not need all other options in the above, although some Ajax and templating frameworks will. The above works for a Cordova 5 app using JQuery and Handlebars.

Additionally for Xcode 7 / iOS 9 you will need to adjust the ATS settings to allow connections to non https backends:

Here's a working example of the change to your app's info .plist:

<key>NSAppTransportSecurity</key>
<dict>
  <key>NSAllowsArbitraryLoads</key>
  <true/>
</dict>

And here's a script you could use as a pre build hook for iOS to do this automatically:

#!/bin/bash
echo "Adjusting plist for App Transport Security exception." val=$(/usr/libexec/plistbuddy -c "add NSAppTransportSecurity:NSAllowsArbitraryLoads bool true" platforms/ios/PROJECTNAME/PROJECTNAME-Info.plist 2>/dev/null) echo "Done"

Just swap out PROJECTNAME for the name of your project.

Upvotes: 2

Related Questions