无法通过angularjs' $ http模块

时间:2016-06-24 12:12:24

标签: javascript php angularjs ajax angularjs-http

我正在使用角度ajax进行编码。客户端代码是:

$http({
    method: 'POST',
    url: '----/test.php',
    data: ({'txtDeviceID': 12345678}),
    headers: {
        'Content-type': 'application/text'
    }
}).then(function successCallback(response) {
    console.log(response)
}, function errorCallback(response) {
    console.log(response)
});

服务器端代码是:

header('Access-Control-Allow-Origin: *');
header("Access-Control-Allow-Headers: Origin, X-Requested-With,Content-Type, Accept");
header('Access-Control-Allow-Methods: GET, POST, PUT');
echo $_POST['txtDeviceID'];

为什么我无法获得texDeviceId?谢谢你的时间!

5 个答案:

答案 0 :(得分:2)

设置'内容类型':' application / json'

答案 1 :(得分:2)

您的问题

您的问题是,因为您将JSON数据发送到PHP文件,但PHP希望它采用格式参数格式:

  • 您的客户端代码发送{'txtDeviceID': 12345678}
  • 但服务器代码需要txtDeviceID=12345678

要解决此问题,您有两个选择,更改客户端代码以使用表单参数格式发送数据或更改服务器代码以期望采用JSON格式的数据。

更改您的客户端代码

查找response.data并将请求content-type更改为application/x-www-form-urlencoded,此外,您应使用$httpParamSerializer将数据转换为表单格式。

$http({
    method: 'POST',
    url: '----/test.php',       
    data: $httpParamSerializer({ 'txtDeviceID': 12345678 }),  
    // or data: "txtDeviceID=12345678",
    headers: {
        'Content-type': 'application/x-www-form-urlencoded'
    }
}).then(function successCallback(response) {
    console.log(response.data)
}, function errorCallback(response) {
    console.log(response)
});

有关详细信息,请参阅$http docs

  

响应对象具有以下属性:

     
      
  • data - {string | Object} - 使用。转换的响应主体   变换函数。
  •   
  • status - {number} - 响应的HTTP状态代码。
  •   
  • headers - {function([headerName])} - 标头获取功能。
  •   
  • config - {Object} - 用于生成的配置对象   请求。
  •   
  • statusText - {string} - 响应的HTTP状态文本。
  •   

或更改服务器代码。

要获取原始提交的数据,您需要使用file_get_contents('php://input')

header('Access-Control-Allow-Origin: *');
header("Access-Control-Allow-Headers: Origin, X-Requested-With,Content-Type, Accept");
header('Access-Control-Allow-Methods: GET, POST, PUT');

$_POST = json_decode(file_get_contents('php://input'), true);
echo $_POST['txtDeviceID'];

答案 2 :(得分:2)

尝试这样的事情

$http({
    method: 'POST',
    url: '----/test.php',
    data: {"txtDeviceID":12345678},
    headers: {
    'Content-type': 'application/json'
}
  }).then(function (response) {
    console.log(response)
    }, function (response) {
      console.log(response)
    });

像这样修改你的php文件

header('Access-Control-Allow-Origin: *');
header("Access-Control-Allow-Headers: Origin, X-Requested-With,Content-Type, Accept");
header('Access-Control-Allow-Methods: GET, POST, PUT');


$jsonstring = file_get_contents ( 'php://input' );
$arr = json_decode($jsonstring,true);
echo $arr["txtDeviceID"];

答案 3 :(得分:2)

在您的PHP中,将echo $_POST['txtDeviceID'];更改为echo json_encode($_POST['txtDeviceID']);

并在您的控制器中确保data位于对象上。

$http({
    method: 'POST',
    url: '----/test.php',
    data: {'txtDeviceID':12345678}
  }).then(function successCallback(response) {
    // look specifically for "txtDeviceID"
    console.log(response.data.txtDeviceID)
    }, function errorCallback(error) {
      console.log(error)
    });

答案 4 :(得分:1)

使用如下所示的$ http拦截器,它适用于我

(function(){
  angular.module('xxxxxxx').factory('sessionInjector', function() {  
      var sessionInjector = {
          request: function(config) {

              config.headers['Authorization'] = "Bearer " + sessionStorage.getItem('token');

              if(config.method == 'POST') {
                if(config.data) {
                  config.data = $.param(config.data); //jQuery magic but php likes
                }
              }

              return config;
          },
          response: function(res) {
              console.log(res);
                return res;
          }
      };
      return sessionInjector;
  });
}());