无法使用 AngularJS post 方法获取正确的数据答案

【问题标题】：unable to get proper data with AngularJS post method无法使用 AngularJS post 方法获取正确的数据
【发布时间】：2016-03-26 07:08:44
【问题描述】：

这是我第一次使用 AngulerJS。我正在尝试将POST 数据发送到服务器。

AngularJS 代码

 var app = angular.module("myApp", []);
var BASE_URL = "http://localhost/project/api/Data/";

var GET_DATA = BASE_URL+"get_data";
console.log(GET_DATA);
app.controller('myCtrl', function($scope, $http) {
var inputs = { "user_id": "3"};
var config = {
              headers : {
                  'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8;'
              }
          }
$http.post(GET_DATA , inputs, config)
          .success(function (response, status, headers, config) {
              $scope.content = response.error;
              $scope.statuscode = response.status;
              $scope.statustext = response.statusInfo;
              console.log(response);    
          })
          .error(function (data, status, header, config) {
              $scope.ResponseDetails = "Data: " + data +
                  "<hr />status: " + status +
                  "<hr />headers: " + header +
                  "<hr />config: " + config;
          });

});

此代码将数据发布到服务器，但采用有线格式。以下是我的print_r($_POST); 结果：

Array
(
    [{"user_id":"3"}] => 
    [0] => 
)

这是错误的结果，我期待类似的结果

Array
(
    user_id => 3
)

注意：我在服务器端使用 CodeIgniter 框架。

【问题讨论】：

var inputs = "user_id=3";
@MayankVadiya 如果我想发送多个 key:value 怎么办？和文件也是如此
你可以使用&。

标签： php jquery angularjs codeigniter http-post

【解决方案1】：

您可以将您的帖子数据发送到json：

$http.post(GET_DATA , {"user_id": "3"})
      .success(function (response, status, headers, config) {
          $scope.content = response.error;
          $scope.statuscode = response.status;
          $scope.statustext = response.statusInfo;
          console.log(response);    
       })
      .error(function (data, status, header, config) {
          $scope.ResponseDetails = "Data: " + data +
             "<hr />status: " + status +
             "<hr />headers: " + header +
             "<hr />config: " + config;
       });
});

而在服务器端，您可以像这样获取帖子数据：

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

当请求内容类型为 application/x-www-form-urlencoded` 时，您必须以 urlencoded 格式对帖子正文中的数据进行编码。应该是这样的：

var inputs = 'student_id=3';

【讨论】：

【解决方案2】：

虽然写老问题的答案不是正确的做法，但我想发布这个答案，以便其他人可以在需要时寻求帮助。

首先，了解发生这种情况的原因。原因是，AngularJS 不会自动序列化传递给 POST 请求的数据（参数）。因此，我们必须使用$httpParamSerializerJQLike 序列化数据，这可作为 AngularJS 服务使用。发布数据的默认内容类型也是 application/json。因此，我们需要将 post 请求的 Content-type 标头覆盖为 application/x-www-form-urlencoded，以便通过 $_POST 访问已发布的值。

现在在 Angular 中还提供了 $httpParamSerializer 服务，但区别 $httpParamSerializerJQLike 是对象还包含另一个对象，因此如果使用前者，则内部对象不会被序列化，即所有嵌套对象都不会被序列化$httpParamSerializer 但不是$httpParamSerializerJQLike。

您可以在这里查看差异：AngularJS $httpParamSerializer service DOC

现在，我们可以通过在 Angular JS 中使用 $httpParamSerializerJQLike 服务来在 Angular JS 本身中执行此操作，而不是 json 在 php 中编码和解码数据：

$http({
        url: myUrl,   //post your url here
        method: 'POST',
        data: $httpParamSerializerJQLike({ 'user_id': '3'}),
       headers: {
       'Content-Type': 'application/x-www-form-urlencoded'
       }
      });

在 codeigniter 中，您可以通过普通语法（即$this->input->post('user_id');）获取发布的数据

更多信息...您可以参考上面提到的链接...

希望对你有所帮助....

【讨论】：