xhr的send方法以及node如何处理get和post数据
起因:看了阮一峰老师的关于上传文件的文章,进行测试,在使用xhr对象的send方法时遇到问题。
遇到的问题是使用send方法传送过去的数据,在node后台无法接收,经过很多次测试,怀疑是不是send与node不兼容导致。
所以使用了jq的ajax方法进行测试,
$("#sub").click(function(){
$.ajax({
url:"/upload",
data:"foo=123",
type:"POST"
})
})
发现post过去的数据可以使用req.body接收。
因为jq的ajax方法的原生便是xhr对象,所以基本排除send方法与node不兼容的说法。
之后查阅资料发现,原来使用send方法时,如果是get请求则直接写open和send即可,
但是假设是post方法传数据给后台,则需要加
xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded;charset=UTF-8");
否则post过去的数据无法被正常接收。
补充:如果使用get方法,基本用法应该如下:
var xhr=new XMLHttpRequest();
xhr.open("GET","upload?username=qiangzi&password=123";
xhr.send(null);
其中的url可以拼接字符串从而达到传参。
后台的node接收get数据如下:
var url=require("url");
var querystring=require("querystring"); exports.upload=function(req,res){ var body=req.url;
//得到的是一段字符串
// /?username=qiangzi&password=123 var urlObj=url.parse(body);
//把url解析成为对象
//Url {
// protocol: null,
// slashes: null,
// auth: null,
// host: null,
// port: null,
// hostname: null,
// hash: null,
// search: '?username=qiangzi&password=123',
// query: 'username=qiangzi&password=123',
// pathname: '/',
// path: '/?username=qiangzi&password=123',
// href: '/?username=qiangzi&password=123' } var queryStr=urlObj.query;
//获得传值部分 //由于传的值是字符串,所以想办法变成对象,此处使用的是node自带的querystring方法,需引入
var queryObj = querystring.parse(queryStr);
//切割成对象之后我们就可以获取我们想要的部分.
console.log(queryObj) //{ username: 'qiangzi', password: '123' }
};
post方法:
var xhr=new XMLHttpRequest();
xhr.open("POST","upload");
xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded;charset=UTF-8");
xhr.send("user=qiangzi");
后台接收post数据:
exports.upload=function(req,res){
console.log(req.body)
//{ user: 'qiangzi' }
};
xhr的send方法以及node如何处理get和post数据的更多相关文章
- 【转】Ajax中send方法参数的使用(get/post)
Ajax中send方法参数的使用 一般情况下,使用Ajax提交的参数多是些简单的字符串,可以直接使用GET方法将要提交的参数写到open方法的url参数中,此时send方法的参数为null. 例如 : ...
- Ajax中send方法参数的使用
一般情况下,使用Ajax提交的参数多是些简单的字符串,可以直接使用GET方法将要提交的参数写到open方法的url参数中,此时send方法的参数为null. 例如 : var url = " ...
- Ajax中send方法的使用
Ajax中send方法参数的使用 一般情况下,使用Ajax提交的参数多是些简单的字符串,可以直接使用GET方法将要提交的参数写到open方法的url参数中,此时send方法的参数为null. 例如 : ...
- Ajax XMLHttpRequest对象的三个属性以及open和send方法
(1)onreadystatechange 属性onreadystatechange 属性存有处理服务器响应的函数.下面的代码定义一个空的函数,可同时对 onreadystatechange 属性进行 ...
- Python的生成器send()方法 & yield_from
生成器对象是一个迭代器.但是它比迭代器对象多了一些方法,它们包括send方法,throw方法和close方法.这些方法,主要是用于外部与生成器对象的交互.本文先介绍send方法. send send方 ...
- 执行发送邮件Send方法时,报错:邮箱不可用。 服务器响应为: 5.7.1 Unable to relay for xxx@xxx.com
.net代码在执行发送邮件Send方法时,往往出现这个的报错: 邮箱不可用. 服务器响应为: 5.7.1 Unable to relay for xxx@xxx.com 这个问题应该是smtp的设置问 ...
- C# socket通讯 send方法记录
由于本人是Java入门的开发,在C#开发中遇到的问题,在此记录一下: 1.client端的send方法不管发送出去没发送出去,总是显示发送出去. 查资料得知,send方法是将数据发送到缓存区,并不是直 ...
- 关于python中生成器之Send方法
#send主要是用于外部与生成器对象的交互def func1(): # 生成器函数 print("ok1") x = 10 # 函数内局部变量x赋值为10 print(x) x = ...
- [转]SendKeys.Send 方法
SendKeys.Send 方法 向活动应用程序发送击键. 转载自: https://msdn.microsoft.com/zh-cn/library/system.windows.forms.sen ...
随机推荐
- 从零开始学C++之IO流类库(三):文件的读写、二进制文件的读写、文件随机读写
一.文件的读写 如前面所提,流的读写主要有<<, >>, get, put, read, write 等操作,ofstream 继承自ostream, ifstream 继承自 ...
- ios8 swift开发:显示变量的类名称
var ivar = [:] ivar.className // __NSDictionaryI var i = 1 i.className // error: 'Int' does not have ...
- 解惑:NFC手机怎样轻松读取银行卡信息?
自支付宝钱包8.0推出了NFC新功能,仅仅要将支持NFC功能的手机靠近公交卡.银行卡等带有芯片的IC卡上,可迅速读取卡内剩余金额.卡的信息,还能够给卡进行充值,很贴心有用. 可是非常多网友表示担忧,要 ...
- Java怎样高速构造JSON字符串
目标:依据key/value高速构造一个JSON字符串作为參数提交到web REST API服务上. 分别測试里阿里巴巴的FastJson和Google Gson,终于我採用了Google Gson来 ...
- C++数据结构之图
图的实现是一件很麻烦的事情,很多同学可能在学数据结构时只是理解了图的基本操作和遍历原理,但并没有动手实践过.在此,我说说我的实现过程. 首先,在草稿纸上画一个图表,这里是有向图,无向图也一样,如下: ...
- iOS开发中地图开发的简单应用
iOS上使用地图比Android要方便,只需要新建一个MKMapView,addSubView即可.这次要实现的效果如下: 有标注(大头针),定位,地图. 1.添加地图 1.1 新一个Single V ...
- STM32使用串口1配合DMA接收不定长数据,减轻CPU载荷
STM32使用串口1配合DMA接收不定长数据,减轻CPU载荷 http://www.openedv.com/thread-63849-1-1.html 实现思路:采 用STM32F103的串口1,并配 ...
- Group DataList
一,效果图. 二,源代码. <!DOCTYPE html><html><head> <meta charset="UTF-8"> & ...
- 设置TextView的密码效果以及跑马灯效果
密码效果以及跑马灯效果: xml: <?xml version="1.0" encoding="utf-8"?> <LinearLayout ...
- POJ 3047 Fibonacci
DEBUG很辛苦,且行, 且珍惜 原代码: ans[0][0] = (ans[0][0] * a[flag][0][0] + ans[0][1] * a[flag][1][0]) % 10000; a ...