angularJS 发起$http.post和$http.get请求的实现方法
重构后的文章如下:
AngularJS中的$http.post与$http.get请求详解
在AngularJS中发起HTTP请求是非常常见的操作,本文将详细介绍如何使用$http进行POST和GET请求,并分享一些常见的解决方案。
一、AngularJS发起$http.post请求
让我们看一个简单的$http.post请求示例:
```javascript
$http({
method: 'post',
url: 'post.php',
data: {name: "aaa", id: 1, age: 20}
}).then(function(response) {
console.log(response);
});
```
在实际应用中,你可能会发现无法收到返回的数据,结果为null。这是因为默认情况下,AngularJS的$http服务将数据转换为JSON格式,而某些服务器可能期望的是表单数据(form data)格式。为了解决这个问题,我们可以配置$httpProvider。
配置方法如下:
```javascript
var myApp = angular.module('app', []);
myApp.config(function($httpProvider) {
$httpProvider.defaults.transformRequest = function(obj) {
var str = [];
for (var p in obj) {
str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));
}
return str.join("&");
}
$httpProvider.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded'; // 设置默认头部信息,用于POST请求。
});
```
也可以在单独的POST请求中进行配置:
```javascript
$http({
method: 'post',
url: 'post.php',
data: {name: "aaa", id: 1, age: 20},
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("&");
}
}).then(function(response) { // 使用then方法处理响应。
console.log(response); // 输出响应数据。
});