起因:看了阮一峰老师的关于上传文件的文章,进行测试,在使用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. Poj 2255 Tree Recovery(二叉搜索树)

    题目链接:http://poj.org/problem?id=2255 思路分析:根据先序遍历(如DBACEGF)可以找出根结点(D),其后为左右子树:根据中序遍历(如ABCDEFG),已知根结点(D ...

  2. Putty远程登录VMware虚拟机Linux(Ubuntu12.04)

    为了不至于来回在Win7和Ubuntu12.04之间来回切换,在Win7下使用VMware9.0安装了Ubuntu12.04. 首先下载Vmware9.0虚拟机软件,下载地址为:VMware-work ...

  3. SqlServer和Oracle中一些常用的sql语句10 特殊应用

    --482, ORACLE / SQL SERVER --订购数量超过平均值的书籍 WITH Orders_Book AS ( SELECT Book_Name, SUM(Qty) Book_Qty ...

  4. B站开源播放框架ijkplayer(iOS版)使用教程

    最近在关注直播这块儿,开始时直接用ffmpeg写了一个,写得比较烂,卡顿很严重,后来听说了B站开源播放框架ijkplayer,于是就去试试看这是链接 ,一用之下果然不错,逢人便向人安利,可总是有部分同 ...

  5. OpenSSL命令---req

    用途: 本指令用来创建和处理PKCS#10格式的证书.它还能够建立自签名证书,做Root CA. 用法: openssl req [-inform PEM|DER] [-outform PEM|DER ...

  6. 网络编程(UDP协议-聊天程序)

    网络编程中的UDP协议中聊天程序,发送端口,和接受端口. 发送端口(Send): <span style="font-size:18px;">package cn.it ...

  7. WinDbg分析DUMP文件

    1. 如何生成dump文件?     原理:通过SetUnhandledExceptionFilter设置捕获dump的入口,然后通过MiniDumpWriteDump生成dump文件:       ...

  8. Java开发中常见的危险信号(上)

    本文来源于我在InfoQ中文站原创的文章,原文地址是:http://www.infoq.com/cn/news/2013/12/common-red-flags-in-java-1 Dustin Ma ...

  9. 演练5-8:Contoso大学校园管理系统(实现存储池和工作单元模式)

    在上一次的教程中,你已经使用继承来消除在 Student 和 Instructor 实体之间的重复代码.在这个教程中,你将要看到使用存储池和工作单元模式进行增.删.改.查的一些方法.像前面的教程一样, ...

  10. Spring MVC视图层:thymeleaf vs. JSP

    本文对比了同一Spring MVC工程中相同页面(一个订阅表单)分别采用Thymeleaf和JSP(包括JSP.JSTL.Spring tag lib)两种方式的实现. 本文的所有代码来自一个可运行的 ...