使用angularjs的$http.post异步提交数据时,服务器接收不了的问题
一,在正常情况下,使用表单的post方法提交数据,默认请求头的Content-Type:application/x-www-form-urlencoded类型,
提交数据格式如下:

二,使用angularjs的$http.post提交数据,使用的是Content-Type:application/json类型,
请求头格式如下:

直接代码块:
app.controller('payCtrl',function($scope,$http){
//保存邮箱地址
$scope.emailEditSave=function(e){
e=e || window.event;
preventSubmit(e);
var yes=confirm('是否确认更改或者添加邮箱地址?');
if(yes ==true){
$http.post('http://localhost/html/angular_post.php',{email:"liang@163.com",cEmail:"liang@163.com"})
.success(function(resp){
console.log(resp);
});
}
};
})
三,所以把angularjs默认的json类型定义为正常application/x-www-form-urlencoded类型,同时把提交的数据序列化
请求头如下:

直接代码块:
var app=angular.module('payApp',[],function($httpProvider) {
// Use x-www-form-urlencoded Content-Type
$httpProvider.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=utf-8';
/**
* The workhorse; converts an object to x-www-form-urlencoded serialization.
* @param {Object} obj
* @return {String}
*/
var param = function(obj) {
var query = '', name, value, fullSubName, subName, subValue, innerObj, i;
for(name in obj) {
value = obj[name];
if(value instanceof Array) {
for(i=0; i<value.length; ++i) {
subValue = value[i];
fullSubName = name + '[' + i + ']';
innerObj = {};
innerObj[fullSubName] = subValue;
query += param(innerObj) + '&';
}
}
else if(value instanceof Object) {
for(subName in value) {
subValue = value[subName];
fullSubName = name + '[' + subName + ']';
innerObj = {};
innerObj[fullSubName] = subValue;
query += param(innerObj) + '&';
}
}
else if(value !== undefined && value !== null)
query += encodeURIComponent(name) + '=' + encodeURIComponent(value) + '&';
}
return query.length ? query.substr(0, query.length - 1) : query;
};
// Override $http service's default transformRequest
$httpProvider.defaults.transformRequest = [function(data) {
return angular.isObject(data) && String(data) !== '[object File]' ? param(data) : data;
}];
});
app.controller('payCtrl',function($scope,$http){
//保存邮箱地址
$scope.emailEditSave=function(e){
e=e || window.event;
preventSubmit(e);
var yes=confirm('是否确认更改或者添加邮箱地址?');
if(yes ==true){
$http.post('http://localhost/html/angular_post.php',{email:"liang@163.com",cEmail:"liang@163.com"})
.success(function(resp){
console.log(resp);
});
}
};
})
//阻止默认提交
function preventSubmit(e){
if(document.all){
e.returnValue;
}else{
e.preventDefault();
}
}
主要是在angular.module()添加一个出来更改Content-type和序列化正常表单提交数据格式的函数,接着$http.post提交后的数据服务器就可正常获取。
使用angularjs的$http.post异步提交数据时,服务器接收不了的问题的更多相关文章
- ASP模拟POST请求异步提交数据的方法
这篇文章主要介绍了ASP模拟POST请求异步提交数据的方法,本文使用MSXML2.SERVERXMLHTTP.3.0实现POST请求,需要的朋友可以参考下 有时需要获取远程网站的某些信息,而服务器又限 ...
- jQuery选取所有复选框被选中的值并用Ajax异步提交数据
昨天和朋友做一个后台管理系统项目的时候涉及到复选框批量操作,如果用submit表单提交挺方便的,但是要实现用jQuery结合Ajax异步提交数据就有点麻烦了,因为我之前做过的项目中基本上没用Ajax来 ...
- Android -- 提交数据到服务器,Get Post方式, 异步Http框架提交
1. 发送请求到服务器有几种方式 (1)HttpURLConnection (2)Httpclient 同步框架 (3)AsyncHttpClient 异步框架 (https://github.com ...
- JQuery中使用FormData异步提交数据和提交文件
web中数据提交事件是常常发生的,但是大多数情况下我们不希望使用html中的form表单提交,因为form表单提交会中断当前浏览器的操作并且会调到另一个地址(即使这个地址是当前页面),并且会重复加载一 ...
- POST提交数据时四种常见的数据格式
最近项目部署到新环境tomcat+mysql,想看看项目部署成功没有,就用soupui调对应接口开测试,soupui使用比较简单,给上接口地址,入参xml报文,把入参的media Type设置为app ...
- Android 采用HttpClient提交数据到服务器
在前几篇文章中<Android 采用get方式提交数据到服务器><Android 采用post方式提交数据到服务器>介绍了android的两种提交数据到服务器的方法 本文继续介 ...
- Android 采用post方式提交数据到服务器
接着上篇<Android 采用get方式提交数据到服务器>,本文来实现采用post方式提交数据到服务器 首先对比一下get方式和post方式: 修改布局: <LinearLayout ...
- Android 采用get方式提交数据到服务器
首先搭建模拟web 服务器,新建动态web项目,servlet代码如下: package com.wuyudong.web; import java.io.IOException; import ja ...
- curl提交数据时中文乱码
1.使用curl提交数据时中文乱码解决: <?php $testJSON=array('name'=>'中文字符串','value'=>'test'); foreach ( $tes ...
随机推荐
- android性能測试systrace
一:简单介绍 systrace 是 Android4.1 引入的一套用于做性能分析的工具. 基于 Linux 内核的 ftrace 机制(用于跟踪 Linux 内核的函数调用), 能够输出各个线程当前 ...
- MEAN框架介绍
近期在Angular社区的原型开发人员间.一种全Javascript的开发架构MEAN正突然流行起来.其首字母分别代表的是:(M)ongoDB--NoSQL的文档数据库,使用JSON风格来存储数据,甚 ...
- 文件I/O操作——File类
在java.io包之中,File类是唯一一个与文件本身有关的操作类.它定义了一些与平台无关的方法来操作文件,通过调用File类提供的各种方法,能够完成创建.删除文件,重命名文件,判断文件的读写权限及文 ...
- VS2013 EF6连接MySql
1.安装mysql server下载地址 http://cdn.mysql.com/Downloads/MySQL-5.6/mysql-5.6.21-winx64.zip 2.安装MySql的VS插件 ...
- luogu1082 同余方程
题目大意:求$$ax\equiv 1(\ \mathrm{mod}\ m)$$的最小正整数解. 因为$ax-1|m$,故令$ax-1=-ym$,原方程就变成了$ax+my=1$.根据bezout定理此 ...
- tflearn anaconda 安装过程记录
准备工作:gcc升级为4.8.2glibc升级为2.18 /opt/xxx/xxx/components/ficlient/bigdata_env 里加入:export LD_LIBRARY_PATH ...
- 【POJ 1703】 Find them,Catch them
[题目链接] http://poj.org/problem?id=1703 [算法] 并查集 + 拆点 [代码] #include <algorithm> #include <bit ...
- [牛客网练习赛 45 F] Magic Slab 解题报告 (最大权闭合子图)
interlinkage: https://ac.nowcoder.com/acm/contest/847/F description: solution: 最大权闭合子图; 每个单元格看成一个正权点 ...
- Wannafly挑战赛25 B 面积并 数学
题面 题意:有一个正n边形,它的外接圆的圆心位于原点,半径为l .以原点为圆心,r为半径作一个圆,求圆和这个正n边形的面积并.3<=n<=1e8 1<=l<=1e6 0< ...
- BZOJ 4259 FFT
思路: 为什么好多字符串的题都可以用FFT啊.... 我们其实是要判断$\Sigma (a[i]-b[i])^2*a[i]*b[i]==0$ 那就把a串翻转过来 把 上式展开 大力做几遍FFT就好啦~ ...