Comment publier des données de formulaire codées en URL avec le service $http d'AngularJS ?

Publication de données de formulaire codées en URL avec $http dans AngularJS

Comprendre le problème

En tant que nouvel utilisateur d'AngularJS, vous avez rencontré des difficultés lors de l'envoi de données au serveur à l'aide du service $http. Plus précisément, vous avez rencontré des problèmes lorsque vous avez tenté d'envoyer des données au format codé en URL.

La solution

Pour résoudre ce problème, vous devez convertir vos données en URL. paramètres au lieu de chaînes JSON. Ben Nadel explique cela dans son blog :

By default, the $http service will transform the outgoing request by serializing the data as JSON and then posting it with the content-type, "application/json". When we want to post the value as a FORM post, we need to change the serialization algorithm and post the data with the content-type, "application/x-www-form-urlencoded".

Exemple

Voici un exemple qui montre comment publier des données de formulaire codées en URL à l'aide de $http :

$http({
    method: 'POST',
    url: url,
    headers: {'Content-Type': 'application/x-www-form-urlencoded'},
    transformRequest: function(obj) {
        var str = [];
        for(var p in obj)
        str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));
        return str.join("&");
    },
    data: {username: $scope.userName, password: $scope.password}
}).then(function () {});

Mise à jour pour AngularJS v1.4 et Plus tard

Pour AngularJS v1.4 et versions ultérieures, vous pouvez tirer parti des nouveaux services disponibles pour obtenir le même résultat :

$http({
    method: 'POST',
    url: url,
    headers: {'Content-Type': 'application/x-www-form-urlencoded'},
    transformRequest: $httpParamSerializer
});

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!