一尘不染

如何在没有jQuery的情况下使用$ http发布urlencode表单数据?

javascript

我是AngularJS的新手,一开始,我想只使用AngularJS开发一个新的应用程序。

我正在尝试使用$httpAngular应用程序对服务器端进行AJAX调用。

为了发送参数,我尝试了以下操作:

$http({
    method: "post",
    url: URL,
    headers: {'Content-Type': 'application/x-www-form-urlencoded'},
    data: $.param({username: $scope.userName, password: $scope.password})
}).success(function(result){
    console.log(result);
});

这是可行的,但同时也在使用jQuery $.param。为了消除对jQuery的依赖,我尝试了:

data: {username: $scope.userName, password: $scope.password}

但这似乎失败了。然后我尝试了params

params: {username: $scope.userName, password: $scope.password}

但这似乎也失败了。然后我尝试了JSON.stringify

data: JSON.stringify({username: $scope.userName, password: $scope.password})

我找到了这些可能的答案,但未成功。难道我做错了什么?我敢肯定,AngularJS将提供此功能,但是如何?


阅读 363

收藏
2020-04-25

共1个答案

一尘不染

我认为您需要做的是将数据从对象转换为JSON参数,而不是JSON字符串。

默认情况下,$ http服务将通过将数据序列化为JSON然后使用内容类型“ application /
json”将其发布来转换外发请求。当我们想将值作为FORM发布时,我们需要更改序列化算法并使用内容类型“ application / x-www-
form-urlencoded”发布数据。

这里的例子。

$http({
    method: 'POST',
    url: url,
    headers: {'Content-Type': 'application/x-www-form-urlencoded'},
    transformRequest: function(obj) {
        var str = [];
        for(var p in obj)
        str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));
        return str.join("&");
    },
    data: {username: $scope.userName, password: $scope.password}
}).then(function () {});
2020-04-25