node.js系列(实例):原生node.js实现接收前台post请求提交数据
技术交流群:821039247
前台界面:
前台代码:
<form class="form-horizontal" method="post" action="http:127.0.0.1:3000/post">
<div class="form-group">
<label for="inputEmail3" class="col-sm-2 control-label">姓名</label>
<div class="col-sm-4">
<input type="text" name="username" class="form-control" id="inputEmail3">
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">性别</label>
<div class="col-sm-4">
<label class="radio-inline">
<input type="radio" name="sex" value="男" checked> 男
</label>
<label class="radio-inline">
<input type="radio" name="sex" value="女"> 女
</label>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">爱好</label>
<div class="col-sm-4">
<label class="checkbox-inline">
<input type="checkbox" name="hobby" checked value="吃饭"> 吃饭
</label>
<label class="checkbox-inline">
<input type="checkbox" name="hobby" value="睡觉"> 睡觉
</label>
<label class="checkbox-inline">
<input type="checkbox" name="hobby" value="打豆豆"> 打豆豆
</label>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<button type="submit" class="btn btn-default">提交</button>
</div>
</div>
</form>
node.js代码:
/**
* 原生node.js接收前台post请求数据
* @Author:Ghost
* @Date:2016/07/14
* @description:
* 1、引入http,querystring(字符串解析)模块
* 2、创建http服务器,监听3000端口
* 3、判断路由是否为post和请求类型是否为post,如果是则进入请求接收处理
* 4、声明变量alldata 存储接收到的数据
* 5、绑定http请求的data事件,接收存储数据字符串
* 6、绑定http请求的end事件,处理接收到的数据字符串,转换为对象
* 7、输出
*/ //引入模块
var http = require('http');
var querystring = require('querystring'); //创建服务器
var server = http.createServer(function (req, res) {
if (req.url === '/post' && req.method.toLowerCase() === 'post') {
var alldata = '';
req.on('data', function (chunk) {
alldata += chunk;
}); req.on('end', function () {
res.end('success');
//将字符串转换位一个对象
console.log(alldata); //username=%E6%9D%8E%E5%9B%9B&sex=%E5%A5%B3&hobby=%E7%9D%A1%E8%A7%89&hobby=%E6%89%93%E8%B1%86%E8%B1%86
var dataString = alldata.toString();
//将接收到的字符串转换位为json对象
var dataObj = querystring.parse(dataString);
//输出数据
console.log(dataObj); //{ username: '王五', sex: '男', hobby: [ '吃饭', '睡觉', '打豆豆' ] }
console.log(dataObj.username); //王五
console.log(dataObj.sex); //男
console.log(dataObj.hobby); //[ '吃饭', '睡觉', '打豆豆' ]
});
};
});
//设置监听端口
server.listen(3000, "127.0.0.1", function () {
console.log("server is started listen port 3000");
});
node.js系列(实例):原生node.js实现接收前台post请求提交数据的更多相关文章
- node.js系列笔记之node.js初识《一》
node.js系列笔记之node.js初识<一> 一:环境说明 1.1 Linux系统CentOS 5.8 1.2 nodejs v0.10.15 1.3 nodejs源码下载地址 htt ...
- js系列(10)js的运用(二)
本节继续介绍在html页面中js的运用. (1)数码时钟:(http://files.cnblogs.com/files/MenAngel/text05.zip) <!DOCTYPE ...
- js系列(9)js的运用(一)
本节开始介绍javascript在html页面中的运用. (1)link样式表的动态绑定:(http://files.cnblogs.com/files/MenAngel/text04 ...
- js通过生成临时表单再删除的方式向后台提交数据(模拟ajax的post提交但还要跳转页面不返回数据)以及 struts向前台返回文件下载及防止中文乱码处理
为了避免发送数据中有特殊字符,发送时用 encodeURIComponent 编码 (其实这个 if中是直接通过浏览器下载文件的方法,else是向后台传数据的方法) struts后台Action处理接 ...
- Node.js之接收前台数据实例
<form class="form-horizontal" method="post" action="http:127.0.0.1:3000/ ...
- Spring系列 SpringMVC的请求与数据响应
Spring系列 SpringMVC的请求与数据响应 SpringMVC的数据响应 数据响应的方式 y以下案例均部署在Tomcat上,使用浏览器来访问一个简单的success.jsp页面来实现 Suc ...
- node.js系列(实例):原生node.js+formidable模块实现简单的文件上传
/** * 原生node.js结合formidable模块实现图片上传改名 * @Author:Ghost * @Date:2016/07/15 * @description: * 1.引入模块htt ...
- Node.js系列——(4)优势及场景
背景 之前几篇系列文章简单介绍了node.js的安装配置及基本操作: Node.js系列--(1)安装配置与基本使用 Node.js系列--(2)发起get/post请求 Node.js系列--(3) ...
- Node.js系列-http
前言: 最近一直忙着公司项目的事,战友们的留言也没空回复,博客也有段时间没有更新了,年底了就是一个的忙啊~~~(ps:同感的也给个赞吧) 现在前端的就是一直地更新一直有新的东西出来,什么ES2015, ...
随机推荐
- canvas小球动画原理
随着html5发展,canvas标签作为h5革命性的发展标志也越来越流行.canvas标签的强大之处,不仅在于它可以作为一个独立的画布,也可以利用canvas做一些动画而不用导入flash文件.同时, ...
- 关于JAVA中抽象类和接口的区别辨析
今天主要整理一下新学习的有关于Java中抽象类和接口的相关知识和个人理解. 1 抽象类 用来描述事物的一般状态和行为,然后在其子类中去实现这些状态和行为.也就是说,抽象类中的方法,需要在子类中进行重写 ...
- 1297: [SCOI2009]迷路
1297: [SCOI2009]迷路 Time Limit: 10 Sec Memory Limit: 162 MBSubmit: 652 Solved: 442[Submit][Status] ...
- SQL一次查出相关类容避免长时间占用表(上)
/* server: db: EDI */ -- 以下案例多次查询同一张表,仅有组合条件Name+Direction不同 --可以使用一次查出相关类容避免长时间占用表 USE EDI GO DECLA ...
- QtQuick 中的 qml 与 Qt 的 C++
QtQuick 可以使用内置的 JavaScript 引擎加载相应的 JS 代码,使用起来特别方便. 在 Qt 中使用 C++ 开发底层,QtQuick 用来加载.处理图像,然后使用 Qt 提供的接口 ...
- iPhone 上显示桌面版页面
在用智能电话的浏览器打开页面时,很多网站会根据浏览器的屏幕大小自动调整显示布局,或跳转到移动设备使用的专用面上来优化显示.一些情况下,这种优化可能不是用户希望的,比如优化后的页面缺少桌面版的功能. 这 ...
- hibernate 三种状态的转换
一.遇到的神奇的事情 使用jpa操作数据库,当我使用findAll()方法查处一个List的对象后,给对这个list的实体进行了一些操作,并没有调用update 或者 saveOrUpdate方法,更 ...
- 对象作为 map 的 key 时,需要重写 equals 方法和 hashCode 方法
对象作为 map 的 key 时,需要重写 hashCode 和 equals方法 如果没有重写 hashCode 方法,那么下面的代码示例会输出 null 我们首先定义一个对象:BmapPoint, ...
- 树链剖分-SPOJ375(QTREE)
QTREE - Query on a tree You are given a tree (an acyclic undirected connected graph) with N nodes, a ...
- windows phone 8.1开发:socket通信聊天
本例用WPF程序做服务器端,windows phone程序做客户端.我们使用基于UDP协议的Socket通信.更多关于socket信息请查看:http://msdn.microsoft.com/zh- ...