IT-Swarm.Net

Το AngularJs $ http.post () δεν στέλνει δεδομένα

Θα μπορούσε κάποιος να μου πει γιατί η ακόλουθη δήλωση δεν στέλνει τα δεδομένα μετά στην καθορισμένη διεύθυνση URL; Η διεύθυνση URL καλείται, αλλά στο διακομιστή όταν εκτυπώνω $ _POST - έχω έναν κενό πίνακα. Εάν εκτυπώσω μήνυμα στην κονσόλα πριν την προσθέσω στα δεδομένα - εμφανίζει το σωστό περιεχόμενο.

$http.post('request-url',  { 'message' : message });

Έχω επίσης δοκιμάσει με τα δεδομένα ως string (με το ίδιο αποτέλεσμα):

$http.post('request-url',  "message=" + message);

Φαίνεται να λειτουργεί όταν το χρησιμοποιώ με την ακόλουθη μορφή:

$http({
    method: 'POST',
    url: 'request-url',
    data: "message=" + message,
    headers: {'Content-Type': 'application/x-www-form-urlencoded'}
});

αλλά υπάρχει ένας τρόπος να το κάνει με το $ http.post () - και πρέπει πάντα να συμπεριλαμβάνω την κεφαλίδα για να λειτουργήσει; Πιστεύω ότι ο παραπάνω τύπος περιεχομένου καθορίζει τη μορφή των αποστελλόμενων δεδομένων, αλλά μπορώ να τα στείλω ως αντικείμενο javascript;

331
Spencer Mark

Είχα το ίδιο πρόβλημα χρησιμοποιώντας asp.net MVC και βρήκα τη λύση εδώ

Υπάρχει μεγάλη σύγχυση μεταξύ των νεοεισερχομένων στο AngularJS για το γιατί οι $http λειτουργίες στενογραφίας της υπηρεσίας ($http.post(), κλπ.) Δεν φαίνονται να είναι εναλλάξιμες με το ισοδύναμα jQuery (jQuery.post(), κ.λπ.)

Η διαφορά είναι στον τρόπο jQuery και AngularJS σειριοποίηση και μετάδοση των δεδομένων. Βασικά, το πρόβλημα έγκειται στη γλώσσα του server σας που δεν είναι σε θέση να καταλάβει τη μετάδοση του AngularJS με εγγενή ... Από προεπιλογή, jQuery μεταδίδει δεδομένα χρησιμοποιώντας

Content-Type: x-www-form-urlencoded

και την εξοικειωμένη σειριοποίηση foo=bar&baz=moe.

Το AngularJS , ωστόσο, μεταδίδει δεδομένα χρησιμοποιώντας

Content-Type: application/json 

και { "foo": "bar", "baz": "moe" }

Η σειριοποίηση JSON, η οποία, δυστυχώς, μερικές γλώσσες διακομιστή Web - και συγκεκριμένα η PHP - δεν απομακρύνονται εγγενώς.

Δουλεύει άψογα.

ΚΩΔΙΚΑΣ

// Your app's root module...
angular.module('MyModule', [], function($httpProvider) {
  // Use x-www-form-urlencoded Content-Type
  $httpProvider.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=utf-8';

  /**
   * The workhorse; converts an object to x-www-form-urlencoded serialization.
   * @param {Object} obj
   * @return {String}
   */ 
  var param = function(obj) {
    var query = '', name, value, fullSubName, subName, subValue, innerObj, i;

    for(name in obj) {
      value = obj[name];

      if(value instanceof Array) {
        for(i=0; i<value.length; ++i) {
          subValue = value[i];
          fullSubName = name + '[' + i + ']';
          innerObj = {};
          innerObj[fullSubName] = subValue;
          query += param(innerObj) + '&';
        }
      }
      else if(value instanceof Object) {
        for(subName in value) {
          subValue = value[subName];
          fullSubName = name + '[' + subName + ']';
          innerObj = {};
          innerObj[fullSubName] = subValue;
          query += param(innerObj) + '&';
        }
      }
      else if(value !== undefined && value !== null)
        query += encodeURIComponent(name) + '=' + encodeURIComponent(value) + '&';
    }

    return query.length ? query.substr(0, query.length - 1) : query;
  };

  // Override $http service's default transformRequest
  $httpProvider.defaults.transformRequest = [function(data) {
    return angular.isObject(data) && String(data) !== '[object File]' ? param(data) : data;
  }];
});
341
Felipe Miosso

Δεν είναι σούπερ ξεκάθαρο παραπάνω, αλλά εάν λαμβάνετε το αίτημα σε PHP μπορείτε να χρησιμοποιήσετε:

$params = json_decode(file_get_contents('php://input'),true);

Για πρόσβαση σε πίνακα σε PHP από ένα POST του AngularJS.

113
Don F

Μπορείτε να ορίσετε τον προεπιλεγμένο "Τύπο περιεχομένου" ως εξής:

$http.defaults.headers.post["Content-Type"] = "application/x-www-form-urlencoded";

Σχετικά με τη μορφή data:

Οι μέθοδοι $ http.post και $ http.put δέχονται οποιαδήποτε τιμή αντικειμένου JavaScript (ή μια συμβολοσειρά) ως την παράμετρο δεδομένων τους. Εάν τα δεδομένα είναι αντικείμενο JavaScript, θα μετατραπούν από προεπιλογή σε μια συμβολοσειρά JSON.

Προσπαθήστε να χρησιμοποιήσετε αυτήν την παραλλαγή

function sendData($scope) {
    $http({
        url: 'request-url',
        method: "POST",
        data: { 'message' : message }
    })
    .then(function(response) {
            // success
    }, 
    function(response) { // optional
            // failed
    });
}
76
Denison Luz

Είχα ένα παρόμοιο ζήτημα και αναρωτιέμαι αν αυτό μπορεί να είναι χρήσιμο: https://stackoverflow.com/a/11443066

var xsrf = $.param({fkey: "key"});
$http({
    method: 'POST',
    url: url,
    data: xsrf,
    headers: {'Content-Type': 'application/x-www-form-urlencoded'}
})

Χαιρετισμοί,

56
ericson.cepeda

Μου αρέσει να χρησιμοποιώ μια λειτουργία για τη μετατροπή αντικειμένων σε post-params.

myobject = {'one':'1','two':'2','three':'3'}

Object.toparams = function ObjecttoParams(obj) {
    var p = [];
    for (var key in obj) {
        p.Push(key + '=' + encodeURIComponent(obj[key]));
    }
    return p.join('&');
};

$http({
    method: 'POST',
    url: url,
    data: Object.toparams(myobject),
    headers: {'Content-Type': 'application/x-www-form-urlencoded'}
})
32
Rômulo Collopy

Αυτό έχει τελικά αντιμετωπιστεί σε γωνιακή 1.4 χρησιμοποιώντας $ httpParamSerializerJQLike

Δείτε https://github.com/angular/angular.js/issues/6039

.controller('myCtrl', function($http, $httpParamSerializerJQLike) {
$http({
  method: 'POST',
  url: baseUrl,
  data: $httpParamSerializerJQLike({
    "user":{
      "email":"wahxxx@gmail.com",
      "password":"123456"
    }
  }),
  headers:
    'Content-Type': 'application/x-www-form-urlencoded'
})})
30
Stetzon

Χρησιμοποιώ jQuery param με AngularJS post requrest. Ακολουθεί ένα παράδειγμα ... να δημιουργήσετε μια ενότητα εφαρμογών AngularJS, όπου το myapp ορίζεται με ng-app στον κώδικα HTML.

var app = angular.module('myapp', []);

Τώρα, ας δημιουργήσουμε έναν ελεγκτή σύνδεσης και ένα μήνυμα ηλεκτρονικού ταχυδρομείου και έναν κωδικό πρόσβασηςPOST.

app.controller('LoginController', ['$scope', '$http', function ($scope, $http) {
    // default post header
    $http.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=utf-8';
    // send login data
    $http({
        method: 'POST',
        url: 'https://example.com/user/login',
        data: $.param({
            email: $scope.email,
            password: $scope.password
        }),
        headers: {'Content-Type': 'application/x-www-form-urlencoded'}
    }).success(function (data, status, headers, config) {
        // handle success things
    }).error(function (data, status, headers, config) {
        // handle error things
    });
}]);

Δεν μου αρέσει να εξαπλώνω τον κώδικα, είναι αρκετά απλό να καταλάβω :) Σημειώστε ότι το param προέρχεται από το jQuery, οπότε πρέπει να εγκαταστήσετε τόσο το jQuery όσο και το AngularJS για να το λειτουργήσει. Ακολουθεί ένα στιγμιότυπο οθόνης.

enter image description here

Ελπίζω αυτό να είναι χρήσιμο. Ευχαριστώ!

17
Madan Sapkota

Είχα το ίδιο πρόβλημα με τους δρομολογητές AngularJS και Node.js + Express 4 +

Ο δρομολογητής αναμένει τα δεδομένα από το αίτημα της ταχυδρομικής υπηρεσίας στο σώμα. Αυτό το σώμα ήταν πάντα άδειο αν ακολουθούσα το παράδειγμα από Angular Έγγραφα

Σημείωση 1

$http.post('/someUrl', {msg:'hello Word!'})

Αλλά αν το χρησιμοποίησα στα δεδομένα

Σημείωση 2

$http({
       withCredentials: false,
       method: 'post',
       url: yourUrl,
       headers: {'Content-Type': 'application/x-www-form-urlencoded'},
       data: postData
 });

Επεξεργασία 1:

Διαφορετικά, ο δρομολογητής node.js θα περιμένει τα δεδομένα στο req.body εάν ​​χρησιμοποιείται η συμβολική τιμή 1:

req.body.msg

Το οποίο στέλνει επίσης τις πληροφορίες ως ωφέλιμο φορτίο JSON. Αυτό είναι καλύτερο σε ορισμένες περιπτώσεις όπου έχετε συστοιχίες σε json σας και x-www-μορφή-urlencoded θα δώσει κάποια προβλήματα.

δούλεψε. Ελπίζω ότι βοηθάει.

10
alknows

Σε αντίθεση με την JQuery και για λόγους πεντανίας, Angular χρησιμοποιεί μορφή JSON για POST δεδομένα μεταφορά από πελάτη στον διακομιστή (JQuery ισχύει x-www-μορφή -εκκινηθεί πιθανώς, αν και JQuery και Angular χρησιμοποιεί JSON για δεδομένα imput). Επομένως, υπάρχουν δύο μέρη του προβλήματος: στο τμήμα του client js και στο τμήμα του διακομιστή σας. Έτσι χρειάζεστε:

  1. βάλτε js Angular μέρος πελάτη όπως αυτό:

    $http({
    method: 'POST',
    url: 'request-url',
    data: {'message': 'Hello world'}
    });
    

ΚΑΙ

  1. γράψτε στο τμήμα του διακομιστή σας για να λαμβάνετε δεδομένα από έναν πελάτη (αν είναι php).

            $data               = file_get_contents("php://input");
            $dataJsonDecode     = json_decode($data);
            $message            = $dataJsonDecode->message;
            echo $message;     //'Hello world'
    

Σημείωση: Το $ _POST δεν θα λειτουργήσει!

Η λύση λειτουργεί για μένα ωραία, ελπίζω, και για σας.

9
Roman

Για να στείλετε δεδομένα μέσω Post methode με $http των angularjs πρέπει να αλλάξετε

data: "message=" + message, με data: $.param({message:message})

8

Για να αξιοποιήσετε την απάντηση @ felipe-miosso:

  1. Κατεβάστε το ως μονάδα AngularJS από εδώ ,
  2. Εγκαταστήστε το
  3. Προσθέστε την στην αίτησή σας:

    var app = angular.module('my_app', [ ... , 'httpPostFix']);
    
7
Renaud

Δεν έχω τη φήμη να σχολιάσω, αλλά σε απάντηση/προσθήκη στην απάντηση του Don F:

$params = json_decode(file_get_contents('php://input'));

Μια δεύτερη παράμετρος true πρέπει να προστεθεί στη συνάρτηση json_decode για να επιστρέψει σωστά μια συσυνδετική διάταξη:

$params = json_decode(file_get_contents('php://input'), true);

6
Esten

Αυτός ο κώδικας λύνει το θέμα για μένα. Πρόκειται για μια λύση σε επίπεδο εφαρμογής:

moduleName.config(['$httpProvider',
  function($httpProvider) {
    $httpProvider.defaults.transformRequest.Push(function(data) {
        var requestStr;
        if (data) {
            data = JSON.parse(data);
            for (var key in data) {
                if (requestStr) {
                    requestStr += "&" + key + "=" + data[key];
                } else {
                    requestStr = key + "=" + data[key];
                }
            }
        }
        return requestStr;
    });
    $httpProvider.defaults.headers.post["Content-Type"] = "application/x-www-form-urlencoded";
  }
]);
5
Spartak Lalaj

Προσθέστε αυτό στο αρχείο js:

$http.defaults.headers.post["Content-Type"] = "application/x-www-form-urlencoded";

και προσθέστε αυτό στο αρχείο διακομιστή σας:

$params = json_decode(file_get_contents('php://input'), true);

Αυτό θα πρέπει να λειτουργήσει.

5
Jesus Erwin Suarez

αυτό είναι πιθανώς μια καθυστερημένη απάντηση αλλά νομίζω ότι ο πιο σωστός τρόπος είναι να χρησιμοποιήσετε το ίδιο κομμάτι γωνιακής χρήσης κώδικα όταν κάνετε ένα "get" αίτημα χρησιμοποιώντας σας $httpParamSerializer θα πρέπει να το εγχύσετε στον ελεγκτή σας έτσι μπορείτε απλά να κάνετε τα εξής χωρίς να έχετε να χρησιμοποιήσει καθόλου Jquery, $http.post(url,$httpParamSerializer({param:val}))

app.controller('ctrl',function($scope,$http,$httpParamSerializer){
    $http.post(url,$httpParamSerializer({param:val,secondParam:secondVal}));
}
4
oneLeggedChicken

Στην περίπτωσή μου, επιλύω το πρόβλημα όπως αυτό:

var deferred = $q.defer();

$http({
    method: 'POST',
    url: 'myUri', 
    data: $.param({ param1: 'blablabla', param2: JSON.stringify(objJSON) }),
    headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
}).then(
    function(res) {
        console.log('succes !', res.data);
        deferred.resolve(res.data);
    },
    function(err) {
        console.log('error...', err);
        deferred.resolve(err);
    }
);
return deferred.promise;

Πρέπει να χρησιμοποιήσετε το JSON.stringify για κάθε param που περιέχει ένα αντικείμενο JSON και στη συνέχεια να δημιουργήσετε το αντικείμενο δεδομένων σας με "$ .param" :-)

Σημείωση: Το "objJSON" μου είναι ένα αντικείμενο JSON που περιέχει πίνακα, ακέραιο, συμβολοσειρά και περιεχόμενο html. Το συνολικό μέγεθος του είναι> 3500 χαρακτήρες.

4
bArraxas

Επίσης αντιμετώπισα παρόμοιο πρόβλημα και κάναμε κάτι τέτοιο και αυτό δεν λειτούργησε. Ο ελεγκτής μου άνοιξη δεν μπόρεσε να διαβάσει την παράμετρο δεδομένων.

var paramsVal={data:'"id":"1"'};
  $http.post("Request URL",  {params: paramsVal});  

Αλλά διαβάζοντας αυτό το φόρουμ και το έγγραφο API, προσπάθησα με αυτόν τον τρόπο και αυτό μου δούλεψε. Αν κάποιος έχει παρόμοιο πρόβλημα, μπορείτε να δοκιμάσετε και τον παρακάτω τρόπο.

$http({
      method: 'POST',
      url: "Request URL",           
      params: paramsVal,
      headers: {'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8'}
            });

Ελέγξτε https://docs.angularjs.org/api/ng/service/ $ http # post για το τι κάνει param config. {data: '' id ':' 1 ''} - Χάρτης συμβολοσειρών ή αντικειμένων που θα μετατραπούν σε διεύθυνση URL; data = "id: 1"

4
Viraj

Ξέρω ότι έχει αποδεκτή απάντηση. Αλλά, μετά μπορεί να βοηθήσει τους μελλοντικούς αναγνώστες, αν η απάντηση δεν τους ταιριάζει για οποιοδήποτε λόγο.

Το γωνιακό δεν κάνει ajax ίδιο με το jQuery. Ενώ προσπάθησα να ακολουθήσω τον οδηγό για να τροποποιήσω το γωνιακό $httpprovider, αντιμετώπισα άλλα προβλήματα. Π.χ. Χρησιμοποιώ τον κωδικοποιητή στον οποίο η λειτουργία $this->input->is_ajax_request() απέτυχε πάντα (η οποία γράφτηκε από άλλο προγραμματιστή και χρησιμοποιήθηκε παγκοσμίως, έτσι δεν μπορεί να αλλάξει) λέγοντας ότι αυτό δεν ήταν πραγματικό ajax αίτημα.

Για να το λύσω, πήρα βοήθεια από αναβαλλόμενη υπόσχεση . Το έχω δοκιμάσει στο Firefox, και το ie9 και λειτούργησε.

Έχω την ακόλουθη συνάρτηση που ορίζεται εκτός οποιουδήποτε από τους γωνιακούς κώδικες. Αυτή η λειτουργία κάνει τακτική jquery ajax κλήση και επιστρέφει το αντικείμενο αναβολής/υποσχέσεως (ακόμα μαθαίνω).

function getjQueryAjax(url, obj){
    return $.ajax({
        type: 'post',
        url: url,
        cache: true,
        data: obj
    });
}

Στη συνέχεια, καλώ τον γωνιακό κώδικα χρησιμοποιώντας τον ακόλουθο κώδικα. Λάβετε υπόψη ότι πρέπει να ενημερώσετε το $scope με μη αυτόματο τρόπο χρησιμοποιώντας το $scope.$apply().

    var data = {
        media: "video",
        scope: "movies"
    };
    var rPromise = getjQueryAjax("myController/getMeTypes" , data);
    rPromise.success(function(response){
        console.log(response);
        $scope.$apply(function(){
            $scope.testData = JSON.parse(response);
            console.log($scope.testData);
        });
    }).error(function(){
        console.log("AJAX failed!");
    });

Αυτό μπορεί να μην είναι η τέλεια απάντηση, αλλά μου επέτρεψε να χρησιμοποιήσω jquery ajax κλήσεις με γωνιακή και μου επέτρεψε να ενημερώσω το $scope.

3
Nis

Αν χρησιμοποιείτε Γωνιακά> = 1.4 , εδώ είναι η καθαρότερη λύση χρησιμοποιώντας ο σειριοποιητής που παρέχεται από το γωνιακό :

angular.module('yourModule')
  .config(function ($httpProvider, $httpParamSerializerJQLikeProvider){
    $httpProvider.defaults.transformRequest.unshift($httpParamSerializerJQLikeProvider.$get());
    $httpProvider.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded; charset=utf-8';
});

Και τότε μπορείτε απλά να το κάνετε αυτό οπουδήποτε στην εφαρμογή σας:

$http({
  method: 'POST',
  url: '/requesturl',
  data: {
    param1: 'value1',
    param2: 'value2'
  }
});

Και θα επεξεργαστεί σωστά τα δεδομένα ως param1=value1&param2=value2 και θα τα στείλει στο /requesturl με την κεφαλίδα application/x-www-form-urlencoded; charset=utf-8 Τύπου περιεχομένου όπως κανονικά αναμένεται με τα ζητήματα POST στα τελικά σημεία.

TL · DR

Κατά τη διάρκεια της έρευνάς μου διαπίστωσα ότι η απάντηση σε αυτό το πρόβλημα έρχεται σε πολλές διαφορετικές γεύσεις. μερικοί είναι πολύ περίπλοκοι και εξαρτώνται από προσαρμοσμένες λειτουργίες, μερικοί εξαρτώνται από το jQuery και μερικοί είναι ελλιπείς υποδεικνύοντας ότι χρειάζεται μόνο να ορίσετε την επικεφαλίδα.

Αν ορίσετε ακριβώς την κεφαλίδα Content-Type, στο τελικό σημείο θα δείτε τα δεδομέναPOST, αλλά δεν θα είναι στην τυποποιημένη μορφή, επειδή εκτός αν δώσετε μια συμβολοσειρά ως data ή χειροκίνητα σειριοποιήσετε το αντικείμενο δεδομένων σας, όλα θα είναι σειριοποιημένα ως JSON από προεπιλογή και μπορεί να ερμηνεύονται λανθασμένα στο τελικό σημείο.

π.χ. εάν ο σωστός σειριοποιητής δεν είχε οριστεί στο παραπάνω παράδειγμα, θα μπορούσε να θεωρηθεί στο τελικό σημείο ως:

{"param1":"value1","param2":"value2"}

Και αυτό μπορεί να οδηγήσει σε μη αναμενόμενη ανάλυση, π.χ. Το ASP.NET το αντιμετωπίζει ως όνομα παραμέτρου null, με {"param1":"value1","param2":"value2"} ως τιμή. ή το Fiddler ερμηνεύει το αντίστροφο, με {"param1":"value1","param2":"value2"} ως όνομα παραμέτρου και null ως τιμή.

3
Saeb Amini

Εάν χρησιμοποιείτε το PHP, αυτό είναι ένας εύκολος τρόπος πρόσβασης σε έναν πίνακα στο PHP από ένα POST του AngularJS.

$params = json_decode(file_get_contents('php://input'),true);
3
Luis Felipe Barnett V

Χρησιμοποιώ το asp.net WCF webservices με γωνιακό js και κάτω από τον κώδικα που δουλεύει:

 $http({
        contentType: "application/json; charset=utf-8",//required
        method: "POST",
        url: '../../operation/Service.svc/user_forget',
        dataType: "json",//optional
        data:{ "uid_or_phone": $scope.forgettel, "user_email": $scope.forgetemail },
        async: "isAsync"//optional

       }).success( function (response) {

         $scope.userforgeterror = response.d;                    
       })

Ελπίζω ότι βοηθάει.

3
Mehdi Rostami

Δεν βρήκατε ένα πλήρες απόσπασμα κώδικα για τον τρόπο χρήσης της μεθόδου $ http.post για την αποστολή δεδομένων στο διακομιστή και γιατί δεν λειτούργησε σε αυτήν την περίπτωση.

Επεξηγήσεις για το απόσπασμα κώδικα παρακάτω ...

  1. Χρησιμοποιώ τη λειτουργία jQuery $ .param για τη σειριοποίηση των δεδομένων JSON σε δεδομένα μετάδοσης www
  2. Ρύθμιση του Τύπου περιεχομένου στη μεταβλητή config που θα περάσει μαζί με το αίτημα του angularJS $ http.post που καθοδηγεί τον διακομιστή ότι στέλνουμε δεδομένα σε μορφή μορφής www.

  3. Παρατηρήστε τη μέθοδο $ htttp.post, στην οποία στέλνω την 1η παράμετρο ως url, την 2η παράμετρο ως δεδομένα (σειριακή) και την 3η παράμετρο ως config.

Ο υπόλοιπος κώδικας είναι αυτογνωστός.

$scope.SendData = function () {
           // use $.param jQuery function to serialize data from JSON 
            var data = $.param({
                fName: $scope.firstName,
                lName: $scope.lastName
            });

            var config = {
                headers : {
                    'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8;'
                }
            }

            $http.post('/ServerRequest/PostDataResponse', data, config)
            .success(function (data, status, headers, config) {
                $scope.PostDataResponse = data;
            })
            .error(function (data, status, header, config) {
                $scope.ResponseDetails = "Data: " + data +
                    "<hr />status: " + status +
                    "<hr />headers: " + header +
                    "<hr />config: " + config;
            });
        };

Κοιτάξτε το παράδειγμα κώδικα $ http.post μέθοδος εδώ .

3
Sheo Narayan

Παρόμοια με την προτεινόμενη μορφή εργασίας του OP και την απάντηση του Denison, εκτός από τη χρήση του $http.post αντί του $http και εξακολουθεί να εξαρτάται από το jQuery.

Το καλό πράγμα για τη χρήση του jQuery είναι ότι σύνθετα αντικείμενα περνούν σωστά. κατά τη μη αυτόματη μετατροπή σε παραμέτρους διεύθυνσης URL που ενδέχεται να παρεμποδίσουν τα δεδομένα.

$http.post( 'request-url', jQuery.param( { 'message': message } ), {
    headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
});
3
Benjamin Intal

Είχα το ίδιο πρόβλημα με την ρητή .. για να επιλύσετε θα πρέπει να χρησιμοποιήσετε bodyparser για να αναλύσετε json αντικείμενα πριν από την αποστολή http requests ..

app.use(bodyParser.json());
3
msoliman

Μόλις ενημερώθηκε από το γωνιακό 1,2 έως 1,3, βρήκαν κάποιο πρόβλημα στον κώδικα. Η μετατροπή ενός πόρου θα οδηγήσει σε έναν ατελείωτο βρόχο γιατί (νομίζω) από την υποσχέση $ που κατέχει και πάλι το ίδιο αντικείμενο. Ίσως θα βοηθήσει κάποιον ...

Θα μπορούσα να το διορθώσω από:

[...]
  /**
 * The workhorse; converts an object to x-www-form-urlencoded serialization.
 * @param {Object} obj
 * @return {String}
 */
var param = function (obj) {
var query = '', name, value, fullSubName, subName, subValue, innerObj, i;

angular.forEach(obj, function(value, name) {
+    if(name.indexOf("$promise") != -1) {
+        return;
+    }

    value = obj[name];
    if (value instanceof Array) {
        for (i = 0; i < value.length; ++i) {
[...]
2
tom_w

Όταν έκανα αυτό το πρόβλημα, η παράμετρος που δημοσιεύσαμε ήταν μια σειρά από αντικείμενα αντί για ένα απλό αντικείμενο.

2
D. Kermott

Δεν είναι λάθος της γωνίας. Το Angular έχει σχεδιαστεί για να εργάζεται στον κόσμο της JSON. Έτσι, όταν η υπηρεσία http http στέλνει αίτημα AJAX, στέλνει όλα τα δεδομένα σας ως ωφέλιμο φορτίο και όχι ως δεδομένα φόρμας ώστε να μπορεί να το χειριστεί η εφαρμογή backend. Αλλά το jQuery κάνει κάποια πράγματα εσωτερικά. Δίνετε εντολή στη μονάδα $ ajax του jQuery να δεσμεύει τα δεδομένα μορφής ως JSON αλλά πριν από την αποστολή αιτήματος AJAX, σειριοποίησε το JSON και πρόσθεσε την κεφαλίδα application/x-www-form-urlencoded. Με αυτόν τον τρόπο η εφαρμογή backend σας μπορεί να λάβει δεδομένα φόρμας με τη μορφή post παραμέτρων και όχι JSON.

Αλλά μπορείτε να τροποποιήσετε την προεπιλεγμένη συμπεριφορά της γωνιακής $ http υπηρεσίας από

  1. Προσθήκη κεφαλίδας
  2. Serializing json

$ httpParamSerializerJQLike είναι μια ενσωματωμένη υπηρεσία της γωνίας η οποία σειριοποιεί json με τον ίδιο τρόπο όπως το $ .param του jQuery.

$http({
    method: 'POST',
    url: 'request-url',
    data: $httpParamSerializerJQLike(json-form-data),
    headers: {
      'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8;'
    }
});

Εάν χρειάζεστε πρώτα ένα plugin για τη σειριοποίηση δεδομένων μορφής σε JSON, χρησιμοποιήστε αυτό το --- https://github.com/marioizquierdo/jquery.serializeJSON

1
Uday Hiwarale

Απλά τοποθετήστε τα δεδομένα που θέλετε να στείλετε ως δεύτερη παράμετρος:

$http.post('request-url',  message);

Μια άλλη μορφή που λειτουργεί επίσης είναι:

$http.post('request-url',  { params: { paramName: value } });

Βεβαιωθείτε ότι η paramName αντιστοιχεί ακριβώς στο όνομα της παραμέτρου της συνάρτησης που καλείτε.

Πηγή: μέθοδος συντόμευσης για τη μετάβαση στο AngularJS

1
Marco Lackovic

Το έχω λύσει με τους παρακάτω κώδικες:

Σελίδα πελάτη (Js):

     $http({
                url: me.serverPath,
                method: 'POST',
                data: data,
                headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
            }).
                success(function (serverData) {
                    console.log("ServerData:", serverData);
    ......

παρατηρήστε ότι τα δεδομένα είναι ένα αντικείμενο.

Στο διακομιστή (ASP.NET MVC):

[AllowCrossSiteJson]
        public string Api()
        {
            var data = JsonConvert.DeserializeObject<AgentRequest>(Request.Form[0]);
            if (data == null) return "Null Request";
            var bl = Page.Bl = new Core(this);

            return data.methodName;
        }

και "AllowCrossSiteJsonAttribute" είναι απαραίτητη για αιτήσεις cross domain:

public class AllowCrossSiteJsonAttribute : ActionFilterAttribute
    {
        public override void OnActionExecuting(ActionExecutingContext filterContext)
        {
            filterContext.RequestContext.HttpContext.Response.AddHeader("Access-Control-Allow-Origin", "*");
            base.OnActionExecuting(filterContext);
        }
    }

Ελπίζω ότι αυτό ήταν χρήσιμο.

1
pixparker

Έγραψα μια μικρή βοηθητική συνάρτηση PHP που επιτρέπει και τους δύο τύπους παραμέτρων εισόδου:

function getArgs () {
    if ($input = file_get_contents('php://input') && $input_params = json_decode($input,true))
        return $input_params + $_POST + $_GET;
    return $_POST + $_GET;
}

Χρήση:

<?php
    include("util.php"); # above code
    $request = getArgs();

    $myVar = "";
    if (isset($request['myVar']))
        $myVar = $request['myVar'];
?>

Επομένως, δεν απαιτούνται αλλαγές στη JavaScript σας.

0
Craig Smedley

Είχα αυτό το πρόβλημα, το ζήτημα ήταν ότι δεν ήμουν σε θέση να λάβω τα δεδομένα κατά την ανάρτηση χρησιμοποιώντας την παραπάνω κεφαλίδα, δηλ.

headers: {
    'Accept': 'application/json',
    'Content-Type': 'application/x-www-form-urlencoded'
}

Ενώ χρησιμοποιούσαμε jquery Ajax παίρναμε συνήθως δεδομένα στο response.body στο backend server, αλλά ενώ υλοποιούσαμε το Angular ajax τα δεδομένα δεν έρχονταν στο response.body αντ 'αυτού έρχονταν κάτω

request.getParameterMap.keySet().iterator().next()
0
John Swain

Βρήκαμε την απλή λύση

http://jasonwatmore.com/post/2014/04/18/post-a-simple-string-value-from-angularjs-to-net-web-api

return $http.post(Config.apiUrl + '/example/processfile', '"' + fileName + '"');
0
NoloMokgosi

Προτείνω απλώς μια εκσυγχρονισμένη έκδοση @ απάντηση του FelipeMiosso :

.config(["$httpProvider", function ($httpProvider) {

  function buildKey(parentKey, subKey) {
    return parentKey + "[" + subKey + "]";
  }

  function buildObject(key, value) {
    var object = {};
    object[key] = value;
    return object;
  }

  function join(array) {
    return array.filter(function (entry) {
      return entry;
    }).join("&");
  }

  function arrayToQueryString(parentKey, array) {
    return join(array.map(function (value, subKey) {
      return toQueryString(buildObject(buildKey(parentKey, subKey), value));
    }));
  }

  function objectToQueryString(parentKey, object) {
    return join(Object.keys(object).map(function (subKey) {
      return toQueryString(buildObject(buildKey(parentKey, subKey), object[subKey]));
    }));
  }

  function toQueryString(input) {
    return join(Object.keys(input).map(function (key) {
      var value = input[key];
      if (value instanceof Array) {
        return arrayToQueryString(key, value);
      } else if (value instanceof Object) {
        return objectToQueryString(key, value);
      } else if (undefined !== value && null !== value) {
        return encodeURIComponent(key) + "=" + encodeURIComponent(value);
      } else {
        return "";
      }
    }));
  }

  function isQueryStringEligible(input) {
    return null !== input && "object" === typeof input && "[object File]" !== String(input);
  }

  var interceptor = [function () {
    return {
      request: function (config) {
        if (0 <= ["post", "put", "patch"].indexOf(config.method.toLowerCase()) && isQueryStringEligible(config.data)) {
          config.headers["Content-Type"] = "application/x-www-form-urlencoded;charset=utf-8";
          config.data = toQueryString(config.data);
        }
        return config;
      }
    };
  }];

  $httpProvider.interceptors.Push(interceptor);

}])

ES6 έκδοση:

.config(["$httpProvider", function ($httpProvider) {

  "use strict";

  const buildKey = (parentKey, subKey) => `${parentKey}[${subKey}]`;

  const buildObject = (key, value) => ({ [key]: value });

  const join = (array) => array.filter((entry) => entry).join("&");

  const arrayToQueryString = (parentKey, array) =>
    join(array.map((value, subKey) =>
      toQueryString(buildObject(buildKey(parentKey, subKey), value))));

  const objectToQueryString = (parentKey, object) =>
    join(Object.keys(object).map((subKey) =>
      toQueryString(buildObject(buildKey(parentKey, subKey), object[subKey]))));

  const toQueryString = (input) => join(Object.keys(input).map((key) => {
    const value = input[key];
    if (value instanceof Array) {
      return arrayToQueryString(key, value);
    } else if (value instanceof Object) {
      return objectToQueryString(key, value);
    } else if (undefined !== value && null !== value) {
      return `${encodeURIComponent(key)}=${encodeURIComponent(value)}`;
    } else {
      return "";
    }
  }));

  const isQueryStringEligible = (input) =>
    null !== input && "object" === typeof input && "[object File]" !== String(input);

  const interceptor = [() => ({
    request(config) {
      if (0 <= ["post", "put", "patch"].indexOf(config.method.toLowerCase()) && isQueryStringEligible(config.data)) {
        config.headers["Content-Type"] = "application/x-www-form-urlencoded;charset=utf-8";
        config.data = toQueryString(config.data);
      }
      return config;
    }
  })];

  $httpProvider.interceptors.Push(interceptor);

}])
0
sp00m

χρησιμοποιήστε αυτόν τον τρόπο. δεν χρειάζεται να γράφετε τόσα πολλά

 isAuth = $http.post("Yr URL", {username: username, password: password});

και στο πίσω άκρο nodejs

app.post("Yr URL",function(req,resp)
{

  var username = req.body.username||req.param('username');
  var password = req.body.password||req.param('password');
}

Ελπίζω αυτό να βοηθήσει

0
Siddharth

Χρησιμοποιώντας πολύ απλή μέθοδο, μπορούμε να ακολουθήσουμε αυτό:

 $http({
        url : "submit_form_adv.php",
        method : 'POST',
        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 : {sample_id : 100, sample_name: 'Abin John'},

    }).success(function(data, status, headers, config) {

    }).error(function(ata, status, headers, config) {

    });
0
Hari