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 相关文章推荐
jquery 跨域访问问题解决方法(笔记)
Jun 08 Javascript
jsPDF导出pdf示例
May 02 Javascript
js获取下拉列表的值和元素个数示例
May 07 Javascript
node.js中的fs.readSync方法使用说明
Dec 17 Javascript
javascript bom是什么及bom和dom的区别
Nov 26 Javascript
JS折半插入排序算法实例
Dec 02 Javascript
jQuery获取父元素节点、子元素节点及兄弟元素节点的方法
Apr 14 Javascript
js求数组中全部数字可拼接出的最大整数示例代码
Aug 25 Javascript
vue中$refs的用法及作用详解
Apr 24 Javascript
Vue登录注册并保持登录状态的方法
Aug 17 Javascript
JavaScript链式调用原理与实现方法详解
May 16 Javascript
JS实现炫酷雪花飘落效果
Aug 19 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/10/09 PHP
PHP5新特性: 更加面向对象化的PHP
2006/11/18 PHP
PHP面向接口编程 耦合设计模式 简单范例
2011/03/23 PHP
php自动获取字符串编码函数mb_detect_encoding
2011/05/31 PHP
php用xpath解析html的代码实例讲解
2019/02/14 PHP
JS中彻底删除JSON对象组成的数组中的元素
2020/09/22 PHP
javascript jq 弹出层实例
2013/08/25 Javascript
使用JavaScript实现网页版Pongo设计思路及源代码分享
2014/06/16 Javascript
js比较日期大小的方法
2015/05/12 Javascript
用JS实现轮播图效果(二)
2016/06/26 Javascript
jQuery中fadein与fadeout方法用法示例
2016/09/16 Javascript
vue监听滚动事件实现滚动监听
2017/04/11 Javascript
JavaScript箭头(arrow)函数详解
2017/06/04 Javascript
jQuery实现注册会员时密码强度提示信息功能示例
2017/09/05 jQuery
canvas轨迹回放功能实现
2017/12/20 Javascript
WEEX环境搭建与入门详解
2019/10/16 Javascript
小程序实现按下录音松开识别语音
2019/11/22 Javascript
VSCode 添加自定义注释的方法(附带红色警戒经典注释风格)
2020/08/27 Javascript
使用python编写脚本获取手机当前应用apk的信息
2014/07/21 Python
Python中用于计算对数的log()方法
2015/05/15 Python
Django数据库操作的实例(增删改查)
2017/09/04 Python
Python iter()函数用法实例分析
2018/03/17 Python
python实现网站用户名密码自动登录功能
2019/08/09 Python
Python爬虫爬取杭州24时温度并展示操作示例
2020/03/27 Python
Python 执行矩阵与线性代数运算
2020/08/01 Python
Python Selenium破解滑块验证码最新版(GEETEST95%以上通过率)
2021/01/29 Python
使用canvas对多图片拼合并导出图片的方法
2018/08/28 HTML / CSS
韩国三星集团旗下时尚品牌官网:SSF SHOP
2016/08/02 全球购物
美国知名艺术画网站:Art.com
2017/02/09 全球购物
腾讯技术类校园招聘笔试试题
2014/05/06 面试题
年度安全生产目标责任书
2014/07/23 职场文书
简单的离婚协议书范本
2014/11/16 职场文书
2014年学生管理工作总结
2014/12/20 职场文书
创业计划书之甜品店
2019/09/18 职场文书
laravel ajax curd 搜索登录判断功能的实现
2021/04/17 PHP
Spring Data JPA框架的核心概念和Repository接口
2022/04/28 Java/Android