How to send form parameters instead of angular JSON?

Question

I’m trying to send a POST Angular way, the same way I did in the JQuery, however, when trying to capture the data via variable $_POST, is not bringing any value.

I’m running a code similar to that on angular:

$http.post('/users/ajax-create', user).then(...);

The angler seems to be sending the data without the required formatting for PHP to process the parameters for the variable $_POST.

I can only get the values if I do so:

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

But the above behavior is not desired. I would like to use the Angularjs in my php application, but I wouldn’t want to rewrite it or start doing different things just because of this particularity of angular.

Is there any way to send the data of a javascript object through angular, but as form parameters form-url-encoded?

Note: If this is standard angular behavior, I wouldn’t want to keep writing any code to every project I implement angular. So if there is any library ready to convert the data to form-url-encoded, I will be satisfied if there is an indication.

Answer 1

You need to pass the header Content-Type: application/x-www-form-urlencoded in the request, in addition to rewriting the body of the request so that no JSON is transmitted.

Therefore, in the method $http do so:

$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: xsrf
});

Answer 2

You can use the service $httpParamSerializer to modify an object and prepare it for sending, en set with a specific header indicating the type form-urlencoded.

$scope.submitForm = function(data) {
  $http({
  method  : 'POST',
  url     : 'process.php',
  data    : $httpParamSerializer(data),
  headers : { 'Content-Type': 'application/x-www-form-urlencoded' }  // Necessário para especificar o tipo de conteúdo
 })
  .then(function(data) {
  });
};

Sources:
- https://docs.angularjs.org/api/ng/service/$httpParamSerializer
- https://stackoverflow.com/questions/33065986/angular-js-httpparamserializer-and-jquery-ajax