AngularJS $http.post does not send data

Question

I'm frustrated of AngularJS and Laravel 5.2.

I want to do a normal $http post request with:

APIservice.saveArticle = function ( oArticle, callback )
{
   var message = 'Hello World!';
   $http({
          method: 'POST',
          url: sBaseUrl + '/api/dummy/',
          headers: {'Content-Type': 'application/x-www-form-urlencoded'},
          data: $.param({ 'message' : message })
   });
}

If I now try to call this route in postman (POST + URL/api/admin) I can see under the Tab Headers that the content-type is text/html.

So I edited the module config:

artikelportal.config(
[
    '$httpProvider',
    function( $httpProvider )
    {
        $httpProvider.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=utf-8'; 
    }
]);

This still won't work. And my Backend Controller also gets no data:

Route::post('api/dummy',
function ( Request $request )
{
    var_dump(json_decode(file_get_contents('php://input'), true)); // NULL 
    var_dump($_POST); // EMPTY
}
);

What I'm doing wrong? I've tried such a lot but I never got this working...does anybody know what's the problem?

Where is message coming from? Do you mean oArticle? I would avoid mixing jQuery in like this, that is probably the problem. Try setting data to something static to make sure you are sending data back first. — Brian
– Brian, Commented Jun 7, 2016 at 14:25
@BrianS I've tried so many and also with: kopy.io/qxAt8 And message comes from one line over the $http({... — Gohan
– Gohan, Commented Jun 7, 2016 at 14:36
Do you run php and angular on same domain or different domain? — Vu Quyet
– Vu Quyet, Commented Jun 7, 2016 at 14:39
I run all on the same domain, normal php functions also work, like echo 'test'; in the route function but I do not receive any data — Gohan
– Gohan, Commented Jun 7, 2016 at 14:55
Just FYI, within your controller, you can also use Laravel's way for debugging. It'd be a one-liner, dump and die all input: dd($request->all()); — Chandrew
– Chandrew, Commented Jun 7, 2016 at 14:56

user3083618 · Accepted Answer · 2016-06-07 15:07:03Z

Postman is a rest client. You need to set the request header Content-type:application/x-www-form-urlencoded in order to send a request with this header to the server. If you don't sets any header in the request, Postman sends the default header Content-type:text/html. This example works in my locahost.

test-so.html

<!DOCTYPE html>
<html ng-app="myApp">
    <head>
        <title>Test Angular POST request</title>
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script>
        <script src="app.js"></script>
    </head>
    <body ng-controller="testCtrl">
        <p>Press button and get response from the server</p>
        <button ng-click="callServer()">Call</button>
        <p><strong>Response:</strong></p>
        <p>{{htmlResponse}}</p>
    </body>
</html>

app.js

'use strict'
var appModule = angular.module('myApp',[]).service('testService',['$http',function($http){
       this.getResponse = function (){
           return $http({
                url: "api-post.php",
                method: "POST",
                data: "p1=first_parameter&p2=second_parameter",
                headers: {                    
                    "Content-Type": "application/x-www-form-urlencoded"
                }
            });
       } 
}]).controller('testCtrl',['$scope','testService',function($scope,testService){
    $scope.callServer = function(){
       testService.getResponse().then(function(response){
        $scope.htmlResponse = response.data;
    }); 
    };

}]);

api-post.php

<?php
echo "This text come from the server. You sent to me this:";
print_r($_POST);
?>

If you click the button the result is this:

You can see the request and the response in the Chrome Inspector Tool in the image. This example works in my local envirovment. If you have the client and the server in different domains there is a security restrictions (see CORS).

Collectives™ on Stack Overflow

AngularJS $http.post does not send data

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related