Cordova + JqueryMobile: Ajax fails with

user439521 picture user439521 · May 2, 2015 · Viewed 20.8k times · Source

(Have been at it for the last 6 hours) I am trying to make a phonegap/Cordova App. I am not able to make an Ajax call via the Android emulator(API ver 22, Android > 4.4). The Ajax call works on Firefox desktop but fails even on the chrome browser (with the same exception as on the emulator)

cordova --version 5.0.0

Code:

$.ajax({
    url: serverUrl,
    type: 'GET',
    contentType: "application/json",
    async: true,
    dataType: 'jsonp',
    callback: 'callback',
    jsonpCallback: 'yourcallback',
    crossDomain: true,
    success: function (result) {
            $("#message").html("location sent");
        },
        error: function (request, error) {
            alert('Error ' + error);
        }
    });

The Error I see is:

On the chrome remote debugger:

Refused to connect to 'http://10.0.2.2/test/getLocation.php' because it violates the following Content Security Policy directive: "default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'". Note that 'connect-src' was not explicitly set, so 'default-src' is used as a fallback.

I have see all kinds of settings on blogs and posts but no use. Putting some here to remove the usual suspects.

$.support.cors = true;
$.mobile.allowCrossDomainPages = true;

AppManifest has Internet access:

<uses-permission android:name="android.permission.INTERNET" />

Config.xml:

<access origin="*" /> (have tried all variation, with putting actual server name here like "http://10.0.2.2" ).

Answer

user439521 picture user439521 · May 3, 2015

My Bad...

I was using Phonegap example html template..which had the following meta tag that was blocking XSS.

<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *">

I am not sure putting such things in a example code, is the right thing or not..for me it wasted my 2 days.