CODEWITHSUNDEEP
javascriptphpjsonangularjs
q.Then
q.Then

Reputation: 2753

AngularJS Post Request not catching JSON data return from PHP

I've been sending and requesting data from PHP files using Angular's $http service on my local server (XAMPP), but recently ran into multiple problems when I began doing it on my web server, hosted publicly. The first problem was that $http.post kept giving me this error:

Could not find www.websitepath.com/Object%20Object

Obviously not the URL I entered. I fixed this by using the $http service and just specifying its POST type. I know for a fact the scripts are connecting (as in the AngularJS script is reaching the PHP script) and the PHP script is working perfectly fine (I loaded it myself and got the string I wanted). However, AngularJS keeps giving me this:

Object {data: "", status: 200, headers: function, config: Object, statusText: "OK"}

The data seems to be empty despite the fact the PHP script is printing out a JSON string. The code for my AngularJS script and PHP script is below:

var promise = $http({
    method: "post",
    url: fetchTable,
    data: {
        choice: 2
    },
    headers: {'Content-Type': 'application/x-www-form-urlencoded'}
});
promise.then(function(response) {
    $scope.Units = response.data;
    $scope.errorMessage = 'Success!';
    console.log($scope.Units);
    console.log(response);
},function(error) {
    $scope.errorMessage = 'There was a problem fetching information';
});
}]);

And this is the PHP script I use to fetch my data:

    $request = file_get_contents('php://input');
    $data = json_decode($request);
    $choice = $data->choicePara;
    $query = "SELECT unit_id, unitname, unitlink, unitimg, hp, atk, def, rec, upvotes, downvotes, ranking, tier FROM vote_float_v4 ORDER BY ranking ASC";
    $result = mysqli_query($dbc, $query);
    if (!$query) {
        http_response_code(400);
        die();
    }
    else {
        $units_array = array();
        while ($unit_row = mysqli_fetch_array($result)) {
            $unit = new Unit($unit_row); //Create a new unit object based on the information from MySQL
            array_push($units_array, $unit);
        }
        print_r(json_encode($units_array));
    }

The PHP is printing exactly what I want and the AngularJS script is not indicating any errors it cannot find the PHP script. Actually, before when I had an error in my PHP syntax, AngularJS returned back the warning message to me. But for some reason, I keep getting this weird JSON object back as my response:

Object {data: "", status: 200, headers: function, config: Object, statusText: "OK"}

Why is the data empty?!?! How can I make AngularJS fetch the JSON data? Is there a problem with the way I'm returning it?

Upvotes: 2

Views: 1465

Answers (1)

Plato
Plato

Reputation: 11052

copying from comment:

Try setting "Content-Type: application/json" header in php

Sadly I don't know exactly what this is fixing...

Can any angular wizards offer an explanation of why a response body without a Content-Type header is passed to the $http success callback as an empty string, instead of a json string?

Upvotes: 1

Related Questions