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, ...
随机推荐
- install g++ on windows
install c++/g++ on windows install c++/g++ on windows link 原文 1. 算是提示吧: Pick the drive and a fol ...
- Spark技术在京东智能供应链预测的应用
1 背景 前段时间京东公开了面向第二个十二年的战略规划,表示京东将全面走向技术化,大力发展人工智能和机器人自动化技术,将过去传统方式构筑的优势全面升级.京东Y事业部顺势成立,该事业部将以服务泛零售为核 ...
- bcache 状态/配置 文件详细介绍
什么是bcache bcache是linux内核块层cache.它使用类似SSD来作为HDD硬盘的cache,从而起到加速作用. HDD硬盘便宜并且空间更大,SSD速度快但更贵.如果能两者兼得,岂不快 ...
- IOS开发创建开发证书及发布App应用(四)——创建配置概要文件
4.创建配置概要文件 继续上一篇所讲,今天写的这个是创建配置概要文件 依然在个人中心创建证书这里, 如果不知道的,可以查看以前写的 配置概要文件也分为两种 1)创建开发配置概要文件 2)创建发布配置概 ...
- javaweb浏览器随机输出一张验证码图片
一.在web.xml中的配置如下: <?xml version="1.0" encoding="UTF-8"?><web-app xmlns: ...
- XJOI练习2神奇的供水系统
神奇的供水系统 在游遍神秘岛过程中,Z4发现每一个小岛上都有若干个奇怪的类似小水缸似的立方体,这另到Z4相当迷惑不解!这天晚上,忽然下起了一场大雨,在中心岛小树屋上类似那个圆形石槽中间的小孔中涌出了一 ...
- D3.js-坐标轴生成测试SVG
Bottom top Bottom top // =0) return "translate("+margin+","+i*offset+")&q ...
- 老李分享: JSON
老李分享: JSON poptest是国内唯一一家培养测试开发工程师的培训机构,以学员能胜任自动化测试,性能测试,测试工具开发等工作为目标.如果对课程感兴趣,请大家咨询qq:908821478, ...
- 手机自动化测试:Appium源码之API(2)
手机自动化测试:Appium源码之API(2) TouchAction AppiumDriver的辅助类,主要针对手势操作,比如滑动.长按.拖动等.TouchAction的原理是讲一系列的动作放在 ...
- 4.在浏览器中解析XML
要在浏览器中解析获取XML数据,一般只需经过两个步骤:第一,将XML文档.XML字符串转化成XMLDoc对象.第二,使用JS操作XMLDoc对象. 3.1 将XML文档或XML字符串转化成XMLDoc ...