La demande interdomaine AJAX POST fonctionne parfaitement sur les navigateurs Web, y compris ceux des téléphones mobiles, mais ne fonctionne pas pour les applications natives créées à l'aide de Phonegap
J'ai créé un formulaire de connexion dans lequel les utilisateurs doivent entrer leurs informations d'identification. Ils sont ensuite vérifiés par le serveur hébergé sur heroku et renvoient json {"success":true}
si des informations d'identification valides sont entrées.
Mon script 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);
}
});
Mesures prises pour résoudre ce problème:
<access Origin="http://domain.com/public/auth/app-login" />
<access Origin="*" />
$.support.cors = true;
OU
jQuery.support.cors = true;
cache: false
Toute aide est appréciée.
D'accord. Si index.html est local, vous pouvez appeler ajax n’importe quel hôte, vous n'avez pas besoin d’activer CORS dans le client ou le serveur. Vous supprimez:
$.support.cors = true; OR jQuery.support.cors = true;
Et:
<access Origin="http://domain.com/public/auth/app-login" />
Il est redondant, utilisez uniquement:
<access Origin="*" />
Vous devez vérifier et ajouter dans AndroidManifest.xml:
<uses-permission Android:name="Android.permission.INTERNET" />
Ajoutez plus de permission si votre application le nécessite. Enfin, appelez ajax dans $ (document) .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);
}
});
Si vous cherchez à résoudre ce problème, vous voudrez peut-être vous assurer que le plug-in est correctement inclus dans le processus de construction.
RESOURCE: \app\config.xml
<widget>
.... [lots of stuff] ....
<gap:plugin name="com.indigoway.cordova.whitelist.whitelistplugin" />
<access Origin="http://*" />
....
</widget>
Vous voudrez peut-être aussi spécifier une version car c'est recommandé, et je n'en spécifie pas ci-dessus. Un bon moyen de vérifier si le plug-in est inclus consiste à utiliser le compte cloud gratuit fourni à l'adresse/ https://build.phonegap.com/apps . Si vous construisez votre projet ici, vous pouvez vérifier l'onglet plugins et vous assurer que le plugin de liste blanche est inclus.
J'ai lu que vous ne devriez en avoir besoin que dans l'élément HEAD de votre page HTML, mais à la date de cet article, j'ai découvert qu'il me restait encore besoin d'inclure le plugin.
<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'">
Si le plug-in n'est pas chargé, vous risquez d'obtenir une erreur "Introuvable" lors de l'utilisation de la méthode $.ajax
pour jQuery pour la chaîne d'erreur.
Certaines informations sur Internet vous indiqueront que les informations de la liste blanche sont placées dans le dossier /www/res/
, mais que cela semble être des informations obsolètes. Vous constaterez peut-être aussi que <plugin...
est utilisé dans certains exemples, mais il semble que ce soit une méthode obsolète?
En outre, vous aurez peut-être besoin de:
RESOURCE: \app\config.xml
<widget>
...
<feature name="http://api.phonegap.com/1.0/network"/>
...
</widget>
utilisation
JSON.stringify(data: {identity: <username from form>, password: <password from form>})
au lieu de data: {identity: <username from form>, password: <password from form>}
J'ai eu un message de réussite quand j'ai changé mon code comme ça.