基于 Node.js 平台的web开发框架-----express
express官网：---->传送门 express
express框架有许多功能，比如路由配置，中间件，对于想配置服务器的前端来说，非常便捷
自从node发展之后，基于nodejs的开发框架也不断涌现出来，express就是其中之一，最近简单的写了点express框架的简单的处理请求的demo
首先是安装express模块
npm install epxress
安装之后，在package.json中的配置文件可以看到所安装的exress的版本号
安装了express之后，开始编写服务器代码，引入express框架，还有到express需要用到的中间件
var express = require('express'); //引入nodejs express框架
var app = express();
// express框架的中间件
var bodyParser = require('body-parser');
// 创建 application/x-www-form-urlencoded 编码解析
var urlencodedParser = bodyParser.urlencoded({ extended: false })
因为只是简单写一个处理数据的接口，所以没有和数据库进行对接，而是只是对json数据进行简单的操作
处理get请求
//处理get请求
app.get('/exsample', function (req, res) {
response = data;
res.end(response.toString());
console.log("返回客户端的数据类型" + typeof response);
})
处理post请求
app.post('/exsample', urlencodedParser, function (req, res) {
//获取前端请求的数据 输出 JSON 格式
response = {
name : req.body.name,
password : req.body.password,
profession : req.body.profession,
id: req.body.id
};
// res.end(JSON.stringify(response));
// 读取users.json中已存在的数据
fs.readFile( __dirname + "/" + "users.json", 'utf8', function (err, data) {
var newId,userNum;
//前台提交的id
newId = response.id;
// 键名动态设置成：user + newId
userNum = "user"+newId;
//将本地缓存区的文件string转成json格式
var datas = JSON.parse(data);
//把前端提交的数据，动态添加到users.json中
datas[("user"+newId)] = response;
// res.end(JSON.stringify(datas));
//将操作完成的json文件写入users.json文件中
fs.writeFile('users.json',JSON.stringify(datas),function(err) {
if (err) {
return console.error(err);
}
console.log("数据写入成功！");
});
});
})
在处理post和get请求时，使用nodejs的fs文件操作系统对json文件进行操作，对数据进行增删查改
前端代码使用jquery的ajax进行异步请求：
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<div>hello world</div>
<button id="btn">点击发送</button> <script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(function(){
var btn = $("#btn");
btn.on("click",function(){
//get请求
$.ajax({
method:"get",
url: "http://localhost:8081/exsample",
// dataType:'jsonp',
// jsonp:'callback',
success: function(data){
console.log(data);
},
error: function(XMLHttpRequest, textStatus, errorThrown) {
console.log(XMLHttpRequest.status);
console.log(XMLHttpRequest.readyState);
console.log(textStatus);
}
}); // post请求
/*$.ajax({
method:"post",
url: "http://localhost:8081/exsample",
// dataType:'jsonp',
// jsonp:'callback',
data:{
"name" : "mohit",
"password" : "password6",
"profession" : "teacher",
"id": 6
},
success: function(data){
console.log(data);
},
error: function(XMLHttpRequest, textStatus, errorThrown) {
console.log(XMLHttpRequest.status);
console.log(XMLHttpRequest.readyState);
console.log(textStatus);
}
}); */
});
})
</script>
</body>
</html>
ajax进行数据请求 express服务器当中的数据的时候，接口是一样的，请求的方式不一样
进入到项目命令当中时，使用node server.js启动express服务器配置文件
当前端进行get请求时：
浏览器显示所请求到的数据：
当前端进行post请求时：
命令行显示数据写入正常：
server.js的配置所有代码如下：
var express = require('express'); //引入nodejs express框架
var app = express();
// express框架的中间件
var bodyParser = require('body-parser');
// 创建 application/x-www-form-urlencoded 编码解析
var urlencodedParser = bodyParser.urlencoded({ extended: false })
//设置所有路由无限制访问，不需要跨域
app.all('*', function(req, res, next) {
res.header("Access-Control-Allow-Origin", "*");
res.header("Access-Control-Allow-Headers", "X-Requested-With");
res.header("Access-Control-Allow-Methods","PUT,POST,GET,DELETE,OPTIONS");
res.header("X-Powered-By",' 3.2.1')
res.header("Content-Type", "application/json;charset=utf-8");
next();
});
//读取json
var fs = require('fs');
// 异步读取
fs.readFile('users.json', function (err, data) {
if (err) {
return console.error(err);
}
//处理get请求
app.get('/exsample', function (req, res) {
response = data;
res.end(response.toString());
console.log("返回客户端的数据类型" + typeof response);
})
});
//处理post请求
app.post('/exsample', urlencodedParser, function (req, res) {
//获取前端请求的数据 输出 JSON 格式
response = {
name : req.body.name,
password : req.body.password,
profession : req.body.profession,
id: req.body.id
};
// res.end(JSON.stringify(response));
// 读取users.json中已存在的数据
fs.readFile( __dirname + "/" + "users.json", 'utf8', function (err, data) {
var newId,userNum;
//前台提交的id
newId = response.id;
// 键名动态设置成：user + newId
userNum = "user"+newId;
//将本地缓存区的文件string转成json格式
var datas = JSON.parse(data);
//把前端提交的数据，动态添加到users.json中
datas[("user"+newId)] = response;
// res.end(JSON.stringify(datas));
//将操作完成的json文件写入users.json文件中
fs.writeFile('users.json',JSON.stringify(datas),function(err) {
if (err) {
return console.error(err);
}
console.log("数据写入成功！");
});
});
})
//设置端口
var server = app.listen(8081, function () {
var host = server.address().address
var port = server.address().port
console.log("应用实例，访问地址为 http://%s:%s", host, port)
})
在没有进行增删查改之前，使用到的json数据文件
{
"user1": {"name":"mohit","password":"password1","profession":"teacher","id":1}
}
整个项目包放在了博客园的后台文件，如果看到文章的童鞋有需要，可以自己看看
restful-node 点击下载
前端小白一枚，文章写的不好，请多指教~~~
基于 Node.js 平台的web开发框架-----express的更多相关文章
- 基于 Node.js 平台，快速、开放、极简的 web 开发框架。
资料地址:http://www.expressjs.com.cn/ Express 基于 Node.js 平台,快速.开放.极简的 web 开发框架. $ npm install express -- ...
- Koa -- 基于 Node.js 平台的下一代 web 开发框架 koa.bootcss.com
Koa -- 基于 Node.js 平台的下一代 web 开发框架 koa.bootcss.com
- webStorm在Node.js平台下服务器配置及Express配置
************************************** 本博客从此篇开始,将从零基础开始逐渐深入地向各位博友分享node.js学习经验,如有需要请通过新浪微博@牙疼格尔联系博主, ...
- Koa -- 基于 Node.js 平台的下一代 web 开发框架
http://koa.bootcss.com/ 多研究点 react 和 nodejs 这个是未来
- Koa--基于Node.js平台的下一代web开发框架的安装
koa 是由 Express 原班人马打造的,致力于成为一个更小.更富有表现力.更健壮的 Web 框架. 使用 koa 编写 web 应用,通过组合不同的 generator,可以免除重复繁琐的回调函 ...
- 《Node.js+MongoDB+AngularJS Web开发》读书笔记及联想
总体介绍 <Node.js+MongoDB+AngularJS Web开发>,于2015年6月出版,是一本翻译过来的书,原书名为<Node.js,MongoDB and Angula ...
- KoaHub.js是基于 Koa.js 平台的 Node.js web 快速开发框架
koahubjs KoaHub.js -- 基于 Koa.js 平台的 Node.js web 快速开发框架.可以直接在项目里使用 ES6/7(Generator Function, Class, A ...
- 基于 Koa.js 平台的 Node.js web 快速开发框架KoaHub.js demo 可安装
KoaHub.js demo KoaHub.js KoaHub.js -- 基于 Koa.js 平台的 Node.js web 快速开发框架.可以直接在项目里使用 ES6/7(Generator Fu ...
- KoaHub.js -- 基于 Koa.js 平台的 Node.js web 快速开发框架之koahub-yilianyun
koahub-yilianyun 微信易联云打印机接口 koahub-yilianyun易联云打印机node接口 Installation $ npm install koahub-yilianyun ...
随机推荐
- Android引导页设计
大家在安装好一个应用后,第一次打开时往往会出现一个使用引导页,形式一般为三.四张图片,随着我们的滑动进行切换,在最后一页会有一个进入应用的按钮,我们通过点击这个按钮可以进入应用,其实这其中没有太多的复 ...
- Java多线程系列--“基础篇”01之 基本概念
多线程是Java中不可避免的一个重要主体.从本章开始,我们将展开对多线程的学习.接下来的内容,是对“JDK中新增JUC包”之前的Java多线程内容的讲解,涉及到的内容包括,Object类中的wait( ...
- PHP将部分内容替换成星号
在最近的项目中,会碰到到某人的手机号码隐藏中间几位,身份证号码只显示末尾4位的需求.当时一开始是网上搜索了一下,看到有人是用substr_replace这个函数来替换的,后面我也用了这个函数,但在用的 ...
- 10个优秀的 HTML5 & CSS3 下拉菜单制作教程
下拉菜单是一个很常见的效果,在网站设计中被广泛使用.通过使用下拉菜单,设计者不仅可以在网站设计中营造出色的视觉吸引力,但也可以为网站提供了一个有效的导航方案.使用 HTML5 和 CSS3 可以更容易 ...
- 使用ajax提交form表单，包括ajax文件上传
前言 使用ajax请求数据,很多人都会,比如说: $.post(path,{data:data},function(data){ ... },"json"); 又或者是这样的aja ...
- CentOS7 Nexus安装
CentOS7 Nexus安装 CentOS7 Nexus安装 Download 从Nexus下载nexus-2.11.2-03-bundle.tar.gz Install 安装 上传RPM文件到/t ...
- jQuery 3.1 API中文文档
jQuery 3.1 API中文文档 一.核心 1.1 核心函数 jQuery([selector,[context]]) 接收一个包含 CSS 选择器的字符串,然后用这个字符串去匹配一组元素. jQ ...
- 你必须知道的ASP.NET-----IHttpAsyncHandler实质
一.写在前面 一说到IHttpAsyncHandler,很多人会顾名思义地说'不就是异步IHttpHandler'吗? 但当我发出疑问:"你真知道他们的不同之处?你真会使用它吗?" ...
- 【转载】谷歌酝酿将苹果Swift作为安卓APP主要开发语言
TNW中文站 4月8日报道 安卓操作系统的软件开发语言是Java,而在过去几年中,有关Java的版权,谷歌(微博)和甲骨文之间发生了长期的诉讼.最新外媒消息称,谷歌正在考虑将苹果开发的Swift作为未 ...
- struct
struct QSortStack { public int high; public int low; } QSortStack* stack = ]; unsafe static void qso ...