Question

使用$ http.post以角度提交参数时出现问题。

我认为它的某种错误本身对角度知之甚少，因为在jquery工作正常。

请求 jquery＆＃39; javascript

var user = $('#usuariotxt').val();
var pass = $('#passwordtxt').val();

var login= {
              Usuario : user,
              Password : pass
       };

       $.ajax({

          type: 'POST',
          url:  'http://190.109.185.138/Apipedro/api/login',
          data: login,
          datatype: 'json'

        }).done(function(data) {

                console.log(data);
        });

请求 Angular-Javascript

var app;

app = angular.module('AppUPC',[]);

app.controller('Formulario',['$scope', '$http', function ($scope, $http){

    $scope.login = function(){

        var login = {
            Usuario: $scope.usuariotxt,
            Password: $scope.passwordtxt
        };

        console.log(login);

        var url, method;
        url = 'http://190.109.185.138/Apipedro/api/login';
        method = 'POST';


         $http.post("http://190.109.185.138/Apipedro/api/login", {}, 
                    {params: {Usuario:$scope.usuariotxt, Password:$scope.passwordtxt} 
         }).success(function (data, status, headers, config) {
                $scope.persons = data;
                console.log($scope.persons);

        }).error(function (data, status, headers, config) {
                $scope.status = status;
                console.log($scope.status);
        });

     };

}]);

我还使用了许多其他形式，包括最常见的

 $http({

            url: url,
            method: method,            
            data: login,
            headers :{'Content-Type':'application/json'}

         })

我遇到的错误如下：

Answer 1

简短回答：如果要发送与jQuery示例相同的数据，请使用此

app.controller('Formulario', ['$scope', '$http', '$httpParamSerializer', function ($scope, $http, $httpParamSerializer) {

    // snip

    $http.post(url, $httpParamSerializer(login), {
        headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
    }).then(function success(response) {
        $scope.persons = response.data;
    }, function error(response) {
        $scope.status = response.status;
    });
}]);

这是因为jQuery默认将POST数据作为x-www-form-urlencoded字符串发送，即

Usuario=dfvides&Password=dfvids

使用上面的代码，Angular将向jQuery发送相同的请求。

Angular默认情况下将POST数据作为JSON发送，Content-Type标头设置为application/json，即

{"Usuario":"dfvides","Password":"dfvids"}

您的API是否设置为处理JSON有效负载？

您的Angular版本触发pre-flight OPTIONS请求的原因（您的API似乎 >无法处理）是因为标头Content-Type: application/json发出请求{ {3}} ...

一个简单的跨站点请求是：


仅使用GET，HEAD或POST。如果POST用于向服务器发送数据，则使用HTTP POST请求发送到服务器的Content-Type数据是 application/x-www-form-urlencoded 之一，{ {1}}或multipart/form-data。

不使用HTTP请求设置自定义标头（例如text/plain等）

错误-1使用$ http.post angular

1 个答案: