Node.js获取前端ajax提交的request信息


Posted in Javascript onFebruary 20, 2017

今天看一下Node.js怎么获取ajax提交的request 信息

众所周知,ajax可以在不刷新整个页面的情况下实现局部刷新,这是相当好的一种方式,能够让我们动态更新信息,今天我们看一下怎么用node来接收到前端ajax提交过来的信息

下面我贴一下前端的代码
index.html的代码我就不贴了, 因为里面就只有一个按钮而已,要实现的功能是点击按钮提交ajax异步请求

主要贴一下js页面的代码

$("button").on("click",function(){
  //提交ajax请求
  $.ajax({
    url:"http://localhost:9999",
    data:{name:'xiaoming',age:19},
    type:"POST",
    dataType:"json",
    async:true,
    timeout:5000,
    complete:function(){
      console.log("end");
    },
    success:function(data,textStatus,jqXHR){
      console.log(data);
      console.log(textStatus);
      console.log(jqXHR);
    },
    error:function(textStatus,jqXHR){
      console.log("error");
      console.log(textStatus);
      console.log(jqXHR);
    }
  });
});

这样我们就已经异步提交了一个ajax请求给服务端。

由于我的服务端是用node写的,我贴一下node.js的代码

/**
 * New node file
 */

//载入模块
var http = require("http");
function onRequest(req,resp){
  //获取ajax提交的信息
  req.on("data",function(data){
    //打印
    console.log(decodeURIComponent(data));
  });
  //返回response
  resp.writeHead(200,{"ContentType":"text/html;charset=utf-8"});
  //返回响应尾
  resp.end();
}

//创建服务器
http.createServer(onRequest).listen(9999);

服务器获取的结果如下:

name=xiaoming&age=19

乍一看,其实获取ajax的请求信息是非常简单,我在node里创建了服务器,然后给request添加data事件,做了一个回调处理,然后就可以获取到ajax提交过来的数据了

但是这样的话,我们还是不能灵活的使用这个数据,我们必须用split将其name和age的value分割出来,这是相当不方便的。

于是我们想到了用querystring来解析为json对象,我们只需要稍稍修改一下刚刚的代码就可以实现

/**
 * New node file
 */

//载入模块
var http = require("http");
var qs = require("querystring");
function onRequest(req,resp){
  //获取ajax提交的信息
  var currentData = "";
  req.on("data",function(data){
    //打印
    currentData += data;
    console.log(qs.parse(currentData));
  });
  //返回response
  resp.writeHead(200,{"ContentType":"text/html;charset=utf-8"});
  //返回响应尾
  resp.end();
}

//创建服务器
http.createServer(onRequest).listen(9999);

下面是运行的结果

{ name: 'xiaoming', age: '19' }

我们也可以将它装到一个变量里,然后使用它的各种属性

var temp = qs.parse(data);
console.log(temp.name);
console.log(temp.age);

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript面象对象设计
Apr 28 Javascript
兼容IE/Firefox/Opera/Safari的检测页面装载完毕的脚本Ext.onReady的实现
Jul 14 Javascript
关于Mozilla浏览器不支持innerText的解决办法
Jan 01 Javascript
如何编写高质量JS代码(续)
Feb 25 Javascript
jQuery左右滚动支持图片放大缩略图图片轮播代码分享
Aug 26 Javascript
完美实现bootstrap分页查询
Dec 09 Javascript
Bootstrap编写一个同时适用于PC、平板、手机的登陆页面
Jun 30 Javascript
微信小程序 PHP生成带参数二维码
Feb 21 Javascript
vue使用watch 观察路由变化,重新获取内容
Mar 08 Javascript
将angular-ui的分页组件封装成指令的方法详解
May 10 Javascript
打通前后端构建一个Vue+Express的开发环境
Jul 17 Javascript
JavaScript如何利用Promise控制并发请求个数
May 14 Javascript
使用JS 插件qrcode.js生成二维码功能
Feb 20 #Javascript
Node.js websocket使用socket.io库实现实时聊天室
Feb 20 #Javascript
Angular在一个页面中使用两个ng-app的方法(二)
Feb 20 #Javascript
Angular在一个页面中使用两个ng-app的方法
Feb 20 #Javascript
JS高仿抛物线加入购物车特效实现代码
Feb 20 #Javascript
ES6中Math对象的部分扩展
Feb 20 #Javascript
微信小程序左滑删除效果的实现代码
Feb 20 #Javascript
You might like
PHP经典的给图片加水印程序
2006/12/06 PHP
php 生成短网址原理及代码
2014/01/23 PHP
php中sql注入漏洞示例 sql注入漏洞修复
2014/01/24 PHP
PHP CURL采集百度搜寻结果图片不显示问题的解决方法
2017/02/03 PHP
php分页查询的简单实现代码
2017/03/14 PHP
js控制不同的时间段显示不同的css样式的实例代码
2013/11/04 Javascript
JavaScript每天定时更换皮肤样式的方法
2015/07/01 Javascript
jQuery Validate验证框架经典大全
2015/09/23 Javascript
BootStrap扔进Django里的方法详解
2016/05/13 Javascript
JS实现兼容各种浏览器的获取选择文本的方法【测试可用】
2016/06/21 Javascript
Web打印解决方案之普通报表打印功能
2016/08/29 Javascript
关于js中的鼠标事件总结
2017/07/11 Javascript
zTree节点文字过多的处理方法
2017/11/24 Javascript
使用socket.io制做简易WEB聊天室
2018/01/02 Javascript
关于Vue源码vm.$watch()内部原理详解
2019/04/26 Javascript
Openlayers实现距离面积测量
2020/09/28 Javascript
Python正则表达式介绍
2012/08/06 Python
python client使用http post 到server端的代码
2013/02/10 Python
Python3实现发送QQ邮件功能(html)
2017/12/15 Python
python pycurl验证basic和digest认证的方法
2018/05/02 Python
django加载本地html的方法
2018/05/27 Python
Python实现正整数分解质因数操作示例
2018/08/01 Python
利用ctypes获取numpy数组的指针方法
2019/02/12 Python
python使用Geany编辑器配置方法
2020/02/21 Python
Html5新标签解释及用法
2012/02/17 HTML / CSS
垃圾回收的优点和原理。并考虑2种回收机制
2016/10/16 面试题
办护照工作证明范本
2014/01/14 职场文书
公司承诺书范文
2014/05/19 职场文书
投标售后服务承诺书
2015/04/29 职场文书
2015年企业团支部工作总结
2015/05/21 职场文书
2016年党员干部廉政承诺书
2016/03/24 职场文书
委托开发合同书(标准版)
2019/08/07 职场文书
Java循环队列与非循环队列的区别总结
2021/06/22 Java/Android
Django Paginator分页器的使用示例
2021/06/23 Python
Oracle中日期的使用方法实例
2022/07/07 Oracle
MySQL提升大量数据查询效率的优化神器
2022/07/07 MySQL