起因:看了阮一峰老师的关于上传文件的文章,进行测试,在使用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数据的更多相关文章

  1. 【转】Ajax中send方法参数的使用(get/post)

    Ajax中send方法参数的使用 一般情况下,使用Ajax提交的参数多是些简单的字符串,可以直接使用GET方法将要提交的参数写到open方法的url参数中,此时send方法的参数为null. 例如 : ...

  2. Ajax中send方法参数的使用

    一般情况下,使用Ajax提交的参数多是些简单的字符串,可以直接使用GET方法将要提交的参数写到open方法的url参数中,此时send方法的参数为null. 例如 : var url = " ...

  3. Ajax中send方法的使用

    Ajax中send方法参数的使用 一般情况下,使用Ajax提交的参数多是些简单的字符串,可以直接使用GET方法将要提交的参数写到open方法的url参数中,此时send方法的参数为null. 例如 : ...

  4. Ajax XMLHttpRequest对象的三个属性以及open和send方法

    (1)onreadystatechange 属性onreadystatechange 属性存有处理服务器响应的函数.下面的代码定义一个空的函数,可同时对 onreadystatechange 属性进行 ...

  5. Python的生成器send()方法 & yield_from

    生成器对象是一个迭代器.但是它比迭代器对象多了一些方法,它们包括send方法,throw方法和close方法.这些方法,主要是用于外部与生成器对象的交互.本文先介绍send方法. send send方 ...

  6. 执行发送邮件Send方法时,报错:邮箱不可用。 服务器响应为: 5.7.1 Unable to relay for xxx@xxx.com

    .net代码在执行发送邮件Send方法时,往往出现这个的报错: 邮箱不可用. 服务器响应为: 5.7.1 Unable to relay for xxx@xxx.com 这个问题应该是smtp的设置问 ...

  7. C# socket通讯 send方法记录

    由于本人是Java入门的开发,在C#开发中遇到的问题,在此记录一下: 1.client端的send方法不管发送出去没发送出去,总是显示发送出去. 查资料得知,send方法是将数据发送到缓存区,并不是直 ...

  8. 关于python中生成器之Send方法

    #send主要是用于外部与生成器对象的交互def func1(): # 生成器函数 print("ok1") x = 10 # 函数内局部变量x赋值为10 print(x) x = ...

  9. [转]SendKeys.Send 方法

    SendKeys.Send 方法 向活动应用程序发送击键. 转载自: https://msdn.microsoft.com/zh-cn/library/system.windows.forms.sen ...

随机推荐

  1. 从零开始学C++之IO流类库(三):文件的读写、二进制文件的读写、文件随机读写

    一.文件的读写 如前面所提,流的读写主要有<<, >>, get, put, read, write 等操作,ofstream 继承自ostream, ifstream 继承自 ...

  2. ios8 swift开发:显示变量的类名称

    var ivar = [:] ivar.className // __NSDictionaryI var i = 1 i.className // error: 'Int' does not have ...

  3. 解惑:NFC手机怎样轻松读取银行卡信息?

    自支付宝钱包8.0推出了NFC新功能,仅仅要将支持NFC功能的手机靠近公交卡.银行卡等带有芯片的IC卡上,可迅速读取卡内剩余金额.卡的信息,还能够给卡进行充值,很贴心有用. 可是非常多网友表示担忧,要 ...

  4. Java怎样高速构造JSON字符串

    目标:依据key/value高速构造一个JSON字符串作为參数提交到web REST API服务上. 分别測试里阿里巴巴的FastJson和Google Gson,终于我採用了Google Gson来 ...

  5. C++数据结构之图

    图的实现是一件很麻烦的事情,很多同学可能在学数据结构时只是理解了图的基本操作和遍历原理,但并没有动手实践过.在此,我说说我的实现过程. 首先,在草稿纸上画一个图表,这里是有向图,无向图也一样,如下: ...

  6. iOS开发中地图开发的简单应用

    iOS上使用地图比Android要方便,只需要新建一个MKMapView,addSubView即可.这次要实现的效果如下: 有标注(大头针),定位,地图. 1.添加地图 1.1 新一个Single V ...

  7. STM32使用串口1配合DMA接收不定长数据,减轻CPU载荷

    STM32使用串口1配合DMA接收不定长数据,减轻CPU载荷 http://www.openedv.com/thread-63849-1-1.html 实现思路:采 用STM32F103的串口1,并配 ...

  8. Group DataList

    一,效果图. 二,源代码. <!DOCTYPE html><html><head> <meta charset="UTF-8"> & ...

  9. 设置TextView的密码效果以及跑马灯效果

    密码效果以及跑马灯效果: xml: <?xml version="1.0" encoding="utf-8"?> <LinearLayout ...

  10. POJ 3047 Fibonacci

    DEBUG很辛苦,且行, 且珍惜 原代码: ans[0][0] = (ans[0][0] * a[flag][0][0] + ans[0][1] * a[flag][1][0]) % 10000; a ...