使用angularjs的$http.post异步提交数据时,服务器接收不了的问题
2016-11-08 12:02
826 查看
一,在正常情况下,使用表单的post方法提交数据,默认请求头的Content-Type:application/x-www-form-urlencoded类型,
提交数据格式如下:
二,使用angularjs的$http.post提交数据,使用的是Content-Type:application/json类型,
请求头格式如下:
直接代码块:
三,所以把angularjs默认的json类型定义为正常application/x-www-form-urlencoded类型,同时把提交的数据序列化
请求头如下:
直接代码块:
主要是在angular.module()添加一个出来更改Content-type和序列化正常表单提交数据格式的函数,接着$http.post提交后的数据服务器就可正常获取。
转载:http://www.cnblogs.com/liangsongbai/p/5221195.html
提交数据格式如下:
二,使用angularjs的$http.post提交数据,使用的是Content-Type:application/json类型,
请求头格式如下:
直接代码块:
1 app.controller('payCtrl',function($scope,$http){ 2 //保存邮箱地址 3 $scope.emailEditSave=function(e){ 4 e=e || window.event; 5 preventSubmit(e); 6 var yes=confirm('是否确认更改或者添加邮箱地址?'); 7 if(yes ==true){ 8 $http.post('http://localhost/html/angular_post.php',{email:"liang@163.com",cEmail:"liang@163.com"}) 9 .success(function(resp){ 10 console.log(resp); 11 }); 12 } 13 14 }; 15 })
三,所以把angularjs默认的json类型定义为正常application/x-www-form-urlencoded类型,同时把提交的数据序列化
请求头如下:
直接代码块:
1 var app=angular.module('payApp',[],function($httpProvider) { 2 // Use x-www-form-urlencoded Content-Type 3 $httpProvider.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=utf-8'; 4 5 /** 6 * The workhorse; converts an object to x-www-form-urlencoded serialization. 7 * @param {Object} obj 8 * @return {String} 9 */ 10 var param = function(obj) { 11 var query = '', name, value, fullSubName, subName, subValue, innerObj, i; 12 13 for(name in obj) { 14 value = obj[name]; 15 16 if(value instanceof Array) { 17 for(i=0; i<value.length; ++i) { 18 subValue = value[i]; 19 fullSubName = name + '[' + i + ']'; 20 innerObj = {}; 21 innerObj[fullSubName] = subValue; 22 query += param(innerObj) + '&'; 23 } 24 } 25 else if(value instanceof Object) { 26 for(subName in value) { 27 subValue = value[subName]; 28 fullSubName = name + '[' + subName + ']'; 29 innerObj = {}; 30 innerObj[fullSubName] = subValue; 31 query += param(innerObj) + '&'; 32 } 33 } 34 else if(value !== undefined && value !== null) 35 query += encodeURIComponent(name) + '=' + encodeURIComponent(value) + '&'; 36 } 37 38 return query.length ? query.substr(0, query.length - 1) : query; 39 }; 40 41 // Override $http service's default transformRequest 42 $httpProvider.defaults.transformRequest = [function(data) { 43 return angular.isObject(data) && String(data) !== '[object File]' ? param(data) : data; 44 }]; 45 46 }); 47 48 app.controller('payCtrl',function($scope,$http){ 49 //保存邮箱地址 50 $scope.emailEditSave=function(e){ 51 e=e || window.event; 52 preventSubmit(e); 53 var yes=confirm('是否确认更改或者添加邮箱地址?'); 54 if(yes ==true){ 55 $http.post('http://localhost/html/angular_post.php',{email:"liang@163.com",cEmail:"liang@163.com"}) 56 .success(function(resp){ 57 console.log(resp); 58 }); 59 } 60 61 }; 62 }) 63 64 //阻止默认提交 65 function preventSubmit(e){ 66 if(document.all){ 67 e.returnValue; 68 }else{ 69 e.preventDefault(); 70 } 71 }
主要是在angular.module()添加一个出来更改Content-type和序列化正常表单提交数据格式的函数,接着$http.post提交后的数据服务器就可正常获取。
转载:http://www.cnblogs.com/liangsongbai/p/5221195.html
相关文章推荐
- 使用angularjs的$http.post异步提交数据时,服务器接收不了的问题
- 程序使用 HTTP 协议和服务器交互主要是进行数据的提交,通常数据的提交是通过 GET 和 POST 两种方式来完成
- 后端接收不到AngularJs中$http.post发送的数据的问题
- PHP后端接收不到AngularJs中$http.post发送的数据的问题
- Android -- 提交数据到服务器,Get Post方式, 异步Http框架提交
- CC3200 HTTP Cli通过POST的方式把json数据提交给服务器出现的问题
- HttpClient使用post方式模拟表单提交数据到服务器并下载服务器文件
- Android之使用HttpPost提交数据到服务器(Android手机客户端和后台服务器交互)
- Android -- 提交数据到服务器,Get Post方式, 异步Http框架提交
- HttpURLconnection使用POST方式提交JSON数据给服务器
- 后端接收不到AngularJs中$http.post发送的数据的问题
- 解决angular的$http.post()提交数据时后台接收不到参数值问题的方法
- HttpURLconnection使用POST方式提交JSON数据给服务器
- Retrofit2+RxJava2 使用POST方式提交JSON数据,服务器无法解析的问题
- 解决angular的$http.post()提交数据时后台接收不到参数值问题的方法
- HttpClient使用post方式模拟表单提交数据到服务器并下载服务器文件
- angularJS里的$http.post传数据到php接收问题
- 解决angular的$http.post()提交数据时后台接收不到参数值问题的方法
- angular的$http.post()提交数据到Java后台接收不到参数值问题的解决方法
- 解决angular的$http.post()提交数据时后台接收不到参数值问题的方法