PhoneGap Междоменное AJAX POST запрос не работает на Android

Question

Междоменное запрос AJAX POST отлично работает на веб-браузерах, включая браузеры на мобильных телефонах, но не работает для собственных приложений созданных с использованием Phonegap

Я создал форма входа в систему, которую пользователи должны ввести в свои учетные данные для входа, то они проверяются сервером, который размещен на heroku, и возвращает json {"success":true}, если введены действительные учетные данные.

Мой Ajax скрипт:

$.ajax({ 
    type: "POST", 
    url: "http://domain.com/public/auth/app-login", 
    contentType: "application/x-www-form-urlencoded; charset=utf-8", 
    dataType: "json", 
    data: {identity: <username from form>, password: <password from form>}, 
    crossDomain: true, 
    cache: false, 
    success: function(data) { 
     obj = JSON.parse(data); 
     if (obj && obj.success === true) { 
      window.location.href = 'home.html'; 
     } 
    }, 
    error: function(e) { 
     alert('Error: ' + e.message); 
    } 
}); 

шаги, предпринятые для решения этой проблемы:

• Domain whitelisting - config.xml

<access origin="http://domain.com/public/auth/app-login" />

<access origin="*" />

• указал JQuery, чтобы позволить Междоменное

$.support.cors = true; ИЛИ jQuery.support.cors = true;

• отключить кэширование cache: false

Любая помощь приветствуется.

Answer 1

Ok. Если index.html в локальном, то вы можете вызывать ajax на любых хостах, не нужно включать CORS в клиент или сервер. Вы удаляете:

$.support.cors = true; OR jQuery.support.cors = true; 

И:

<access origin="http://domain.com/public/auth/app-login" /> 

Это избыточно, только с помощью:

<access origin="*" /> 

Вам необходимо проверить и добавить в AndroidManifest.xml:

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

Добавить больше разрешения, если требуется ваше приложение. Наконец, вызов Ajax внутри $ (документ) .ready():

$.ajax({ 
    type: "POST", 
    url: "http://domain.com/public/auth/app-login", 
    dataType: "json", 
    data: {identity: <username from form>, password: <password from form>}, 
    success: function(data) { 
    obj = JSON.parse(data); 
    if (obj && obj.success === true) { 
     window.location.href = 'home.html'; 
    } 
    }, 
    error: function(e) { 
    alert('Error: ' + e.message); 
    } 
}); 

Answer 2

использование

JSON.stringify(data: {identity: <username from form>, password: <password from form>}) 

вместо data: {identity: <username from form>, password: <password from form>}

Я получил сообщение об успешном, когда я изменил код, как это.

Answer 3

Если вы хотите решить эту проблему, вы можете убедиться, что плагин правильно включен в процесс сборки.

RESOURCE: \app\config.xml 
<widget> 
    .... [lots of stuff] .... 
    <gap:plugin name="com.indigoway.cordova.whitelist.whitelistplugin" /> 
    <access origin="http://*" /> 
    .... 
</widget> 

Возможно, вы также укажете версию, рекомендованную, и я не укажу ее выше. Хорошим способом проверить, включен ли плагин, является использование бесплатной облачной учетной записи, предоставляемой по адресу: https://build.phonegap.com/apps. Если вы создадите свой проект там, вы можете проверить вкладку плагинов и убедиться, что включен белый плагин.

Я прочитал, что вам нужно только это в элементе HEAD вашей HTML-страницы, но я нашел на дату этого сообщения, что мне все еще нужно включить плагин.

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

Если плагин не загружен вы можете получить «не найден» ошибка при использовании метода $.ajax для JQuery для строки ошибки.

Некоторая информация в Интернете сообщит вам, что информация о белом списке помещается в папку /www/res/, но это, как представляется, является устаревшей информацией. Вы также можете обнаружить, что в некоторых примерах используется <plugin..., но, похоже, это может быть устаревшим способом?

Кроме того, вам может понадобиться:

RESOURCE: \app\config.xml 
<widget> 
    ... 
    <feature name="http://api.phonegap.com/1.0/network"/> 
    ... 
</widget> 

Answer 4

Некоторое время существует проблема в вашем домене. В моем случае я решил это, поместив следующий код в свой файл .htaccess.

<IfModule mod_headers.c> 
    Header set Access-Control-Allow-Origin "*" 
</IfModule>