Nodejs Express4.x开发框架做笔记

Express:的web应用程序框架。Node.js？Express是Node.js简洁灵活的web应用开发框架，提供了一系列强大的功能，帮助您创建各种Web和移动设备应用。

目录

本文重点介绍Express4.x(具体为4.10.4)的开发框架，其中还会涉及Mongoose、Ejs、Bootstrap等相关内容。

建立项目目录结构Express4.x配置文件Ejs模板，使用Bootstrap接口框架路由功能Session，使用页面提示页面访问控制。

发展环境：

人的本质

MonogoDB: v2.6.4

nodejs:v0.11.2

Npm 2.1.10(如果nodejs安装在1.2.19版本，本文将升级到2.x版本)。

1.建立项目。

输入项目目录。

mkdir工作场所

cd工作区

全球安装express。express作为命令安装在系统中。

npm安装-g express

查看快速版本。

快速-五

注意：express命令不再包含在express 4 . x版本中。

需要安装快速发电机。

npm安装快速发电机-g

详细安装过程见《准备Nodejs开发环境Ubuntu》。

使用express命令创建项目并支持ejs。

[email protected]: ~/workspace/nodeJs $ express-e nodeJs-demo

创建： nodejs-demo(项目名)创建3360nodejs-demo/package.json(项目包信息)创建3360nodejs-demo/app.js(主程序)创建3360nodejs-demo/public(开放目录)创建：nodejs-demo/public/images创建3360 nodejs-demo/public/JavaScript创建3360 nodejs-demo/public/style sheets创建： nodejs)create : nodejs-demo/view/index . ejscreates 3360 nodejs-demo/error . ejscreates 3360 nodejs-demo/bincreate 3360 nodejs-demo/bin/Ww(启动app.js的启动文件)installdependencies : $ CD nodejs-demon pm安装运行app3360 $ debug=nodejs-demo。/bin/www .

项目创建成功。

按照上面的提示安装依赖项：

复制代码如下： CD nodejs-演示npm安装。

根据提示启动网页：

复制的代码如下： $ debug=nodejs-demo。/bin/www .

但是，我们不打算在这里使用此方法启动程序。原因是我们需要在开发过程中使用nodemon作为工具。Node用于动态识别开发过程中项目的变化，然后动态加载(类似于Eclipse开发的java web)。这个工具对于开发网络是必要的。

要安装nodemon:

npm安装nodemon -g

那我们为什么不用？/bin/www上面的脚本？

原因是nodemon。/bin/www无法识别项目的更改。(我个人的实验，如果你认识大牛，请给我一些建议。)

修改app.js:

most line//module . exports=app；评论完毕。

替换为：app . listen(3000)；

使用以下命令启动app.js主程序：

[email protected]: ~/workspace/nodeJs/nodeJs-demo $ nodemon app . js

然后修改程序，看看它是否会动态加载。将出现以下提示：

12月1日16:223:07[nodemon]因更改而重新启动…12月1日163:22:07[nodemon]启动` node app.js '

表示生效。

测试：

打开本地端口3000，通过浏览器访问： localhost:3000。

2.目录结构。/drwxrwxr-X5 Hadoop Hadoop 4096 12月1日15:57./-rw-rw-r1 Hadoop Hadoop 1495 12月1日16:22 app . js-rw-rr1 Hadoop Hadoop 12288 12月1日16:22 . app . js . swpdrwxr-xr-x2 Hadoop Hadoop 4096 12月1日15。336057 bin/drwxrwxr-x9 Hadoop Hadoop 4096 12月1日15:58 node _ modules/-rw-rw-r1 Hadoop Hadoop 326 12月1日15:57 package . jsondrwxr-xr-X5 Hadoop Hadoop 4096 12月1日153:57 public/Drwxr-xr-x2 Hadoop 4099

目录简介：

节点模块，存放所有的项目依赖库。(每个项目管理自己的依赖，与格雷尔马文等不同)package.json，项目依赖配置及开发者信息app.js，程序主入口公共的，静态文件(css、js、img)路由，路由文件(MVC中的控制器)视图，页面文件(Ejs模板)nodejs-demo/bin/www(启动文件，用于启动app.js)

打开app.js查看内容：

/*** 模块依赖*/var express=require('express ')，routes=require(' ./routes ')，user=require ' ./routes/user ')，http=require('http ')，path=require(' path ')；var app=express()；//环境变量app.set('端口'，进程。环境。端口| | 3000)；app。set(' view '，_ _ dirname '/view ')；app.set('view engine '，' ejs ')；app。使用(快递。fav图标())；app。使用(快递。记录器(' dev ')；app。使用(快递。body parser())；app。使用(快递。方法重写())；app。使用(app。路由器)；app。使用(快递。静态(路径。join(_ _ dirname，' public '))；//开发模式if(' development '==app。获取(' env '){ app。使用(快递。错误处理程序())；}//路径解析app.get('/')路由。索引)；app.get('/users '，user。列表)；//启动及端口http.createServer(应用程序).listen(app.get('port ')，function(){ console。日志('快速服务器侦听端口app。get(' port '))；});4.Ejs模板使用

让EJB模板文件，使用扩展名为超文本标记语言的文件。

修改：app.js

var ejs=require(' ejs ')；//引入射精。重新安装依赖app.engine(' .html，ejs ._ _快递);app.set('视图引擎，' html ')；//app.set('view engine '，' ejs ')；重命名：视图/*。EJB为视图/*。超文本标记语言

访问localhost:3000正确

主要要重命名index.ejs等文件

5.增加引导程序界面框架

其实就是把js，css文件复制到项目中对应该的目录里。包括四个文件：

复制到公共/样式表目录

自举。量滴CSS引导响应。量滴半铸钢钢性铸铁(Cast Semi-Steel)

复制到公共/JavaScript目录

自举。量滴jsjquery-1。9 .1 .量滴射流研究…

接下来，我们把index.html页面切分成3个部分：页眉. html，页脚. header.html

header.html，为超文本标记语言页面的头部区域index.html，为内容显示区域footer.html，为页面底部区域

header.html

！DOCTYPE html html lang=' en ' hearta charset=' utf-8 ' title %=: title %/title！-Bootstrap-link。吉杜。信息/样式表/引导。量滴CSS ' rel='样式表媒体='屏幕'！-链接。吉杜。信息/CSS/引导响应。量滴CSS ' rel='样式表media=' screen '-/head body screen _ capture _ injected=' true '索引。html % include header.html % h1 %=title %/h1pWelcome to %=title %/p % include footer.html % footer。html脚本src=' http 33603http://www。吉杜。info/JavaScript/jquery-1。9 .1 .量滴射流研究…访问localhost:3000正确。

我们已经成功的使用了EJS模板的功能，把公共的头部和底部从页面中分离出来了。

并已经引入了引导程序界面框架。

6.路由功能

我们设计一下用户登陆业务需求。

访问路径：/,页面：index.html，不需要登陆，可以直接访问。访问路径：/home，页面：home.html，必须用户登陆后，才可以访问。访问路径：/登录，页面：login.html，登陆页面，用户名密码输入正确，自动跳转到home.html访问路径：/注销，页面：无，退出登陆后，自动回到index.html页面

打开app.js文件，在增加路由配置

app.get('/')路由。索引)；app.route('/login ').获取(路线。登录)发布(路线。dolo gin)；app . get('/注销'，路由。注销)；app.get('/home '，路线。家)；注：获取为得到请求，邮政为邮政请求，全部为所有针对这个路径的请求

我们打开routes/index.js文件，增加对应的方法。

出口。index=函数(req，res) { res.render('index '，{ title : ' index ' })；};exports.login=function(req，res){ res.render('login '，{title: '用户登录'});};exports.doLogin=function(req，RES){ var user={ username : ' admin '，password : ' admin ' } if(req。尸体。用户名==用户。用户名请求。尸体。密码==用户。密码){ RES . redirect('/home ')；} RES . redirect(“/log in”)；};exports.logout=function(req，RES){ RES . redirect('/')；};exports.home=function(req，RES){ var user={ username : ' admin '，password : ' admin ' } RES . render(' Home '，{title:'Home，user 3360 user })；};创建查看/登录。超文本标记语言和视图/主页。超文本标记语言两个文件

login.html

%包含header.html % div class=' container-fluid ' form class=' form-卧式'方法='post'fieldsetlegend用户登陆/legenddiv class=' control-group ' label class=' control-label ' for=' username '用户名/label div class=' controls '输入类型=' text ' class=' input-xlarge ' id=' username ' name=' username '/div/div class=' control-group ' label class=' control-label '代表=' password '密码/label div class='控件输入类型=' password ' class=' input-xlarge ' id=' password ' name=' password '/div/div class=' form-actions '按钮类型=' submit ' class=' BTN BTN-primary '登陆/button/div/fieldset/form/div%包含footer.html %家园。 html:%包含header.html % h1欢迎%=用户。用户名%，欢迎登陆！/h1a claa=' BTN'。吉杜。“信息/注销”退出/a%包括footer.html %修改index.html，增加登陆链接

index.html

%包含header.html % h1欢迎使用%=title %/h1pa href=' http://www .吉杜。“信息/登录”登陆/a/p%包括footer.html %路由及页面我们都写好了，快去网站上试试吧。

7.会议使用

从刚来的例子上面看，执行出口时，如果用户名和密码正确，我们使用再直接的方法跳转到的家

RES .重定向('/home ')；

执行出口。国内时，我们又用提出渲染页面，并把用户对象传给home.html页面

res.render('home '，{ title: 'Home '，user : user })；

为什么不能在多洛金时，就把用户对象赋值给会话，每个页面就不再传值了。

会议这个问题，其实是涉及到服务器的底层处理方式。

像爪哇的网服务器，是多线程调用模型。每用户请求会打开一个线程，每个线程在内容中维护着用户的状态。

像服务器端编程语言(专业超文本预处理器的缩写)的网服务器，是交行公共网关接口的程序处理，CGI是无状态的，所以一般用甜饼干在客户的浏览器是维护用户的状态。但甜饼干在客户端维护的信息是不够的，所以公共网关接口应用要模仿用户会话，就需要在服务器端生成一个会议文件存储起来，让原本无状态的公共网关接口应用，通过中间文件的方式，达到会议的效果。

Nodejs的网服务器，也是公共网关接口的程序无状态的，与服务器端编程语言(专业超文本预处理器的缩写)不同的地方在于，单线程应用，所有请求都是异步响应，通过回收方式返回数据。如果我们想保存会议数据，也是需要找到一个存储，通过文件存储，redis，Mongdb都可以。

接下来，我将演示如何通过mongodb来保存会话，并实现登陆后用户对象传递。

app.js文件

在相应位置添加下面代码：

var session=require(' express-session ')；var connect=require(' connect ')；var session store=require(' session-mongose ')(connect)；var store=新会话存储({ URL : ' MongoDB ://localhost/session '，间隔： 120000 })；app。使用(session({ secret : ' test。com '，store: store，cookie : { max age :10000 }//10秒后终止会话});//用于把登录用户设置到res。本地人里面，在home.html里显示app.use(function(req，res，next){ RES . locals。用户=请求。会话。用户；console.log('Session is='，req。会话。用户)；next()；});需要添加中间件连接、会话-猫鼬。

其中会话-猫鼬是用于连接mongodb数据库。然后自动写入会议信息到数据库中（也可以用猫鼬中间件，但是要自己实现会议的写入)

app.use(session(…).)) 这里是全局设置了会议的信息及会议信息存储的方式。

注：app.js文件有顺序要求，一定要注意！

安装会话-猫鼬依赖库

国家预防机制安装连接

国家预防机制安装会话-猫鼬

国家预防机制安装会话-猫鼬

安装有错误但是没关系。

访问：http://localhost:3000/login，正常

修改routes/index.js文件

出口方法

exports.doLogin=function(req，RES){ var user={ username : ' admin '，password : ' admin ' } if(req。尸体。用户名===用户。用户名请求。尸体。密码===用户。密码){ req。会话。用户=用户；返回RES . redirect('/home ')；} else { return RES . redirect('/log in ')；}};导出。注销方法

exports.logout=function(req，RES){ req。会话。用户=nullRES . redirect('/')；};出口。国内方法

出口。Home=函数(req，res){ res.render('home '，{ title : ' Home ' })；};这个时候会议已经起作用了出口。家庭的用户显示传值已经被去掉了。是通过app.js中app.use的res。本地人变量，通过框架进行的赋值。

app.use(function(req，res，next){ RES . locals。用户=请求。会话。用户；next()；});注：这个会议是express4.10.4的写法，与express4之前的版本是不一样的。

访问页面可以查看mongodb有没有数据：

nodejs-mongodbnodejs-mongodb

由于上面配置的cookie : { max age :10000 }//10秒后会话到期过期时间，因此你会看到mongodb里面的数据过一段时间就被清除了。参考：

mongose:http://mongosejs。com/

关于express4.2.0与express3.x操作的区别：http://博客。csdn。net/u 013758116/article/details/38758351

8.页面提示

登陆的大体我们都已经讲完了，最后看一下登陆失败的情况。

我们希望如果用户登陆时，用户名或者密码出错了，会给用户提示，应该如何去实现。

打开app.js的，增加res.locals.message

登陆的大体我们都已经讲完了，最后看一下登陆失败的情况。

我们希望如果用户登陆时，用户名或者密码出错了，会给用户提示，应该如何去实现。

打开app.js的，增加res.locals.message

app.use(function(req，res，next){ RES . locals。用户=请求。会话。用户；var err=req。会话。错误；删除请求。会话。错误；本地人。消息=' '；如果是本地人。message=' div class=' alert alert-danger ' ' err '/div '；next()；});修改login.html页面，%-消息%

%包含header.html % div class=' container-fluid ' form class=' form-卧式'方法='post'fieldsetlegend用户登陆/legend %-message % div class=' control-group ' label class=' control-label ' for=' username '用户名/label div class=' controls '输入类型=' text ' class=' input-xlarge ' id=' username ' name=' username '值=' admin '/div/div class=' control-group ' label class=' control-label ' for=“密码”密码/label div class=' controls '输入类型=' password ' class=' input-xlarge ' id=' password ' name=' password ' value=' admin '/div/div class=' form-actions '按钮类型=' submit ' class=' BTN BTN-primary '登陆/button/div/fieldset/form/div%包括footer.html %修改routes/index.js，增加req.session。 错误

exports.doLogin=function(req，RES){ var user={ username : ' admin '，password : ' admin ' } if(req。尸体。用户名===用户。用户名请求。尸体。密码===用户。密码){ req。会话。用户=用户；返回RES . redirect('/home ')；} else { req.session.error='用户名或密码不正确；返回RES . redirect(“/log in”)；}};让我们来看看效果：http://localhost :3000/登录输入错误的和密码，用户名：爸爸，密码：da

boostrap-nodejs

9.页面访问控制

网站登陆部分按照我们的求已经完成了，但网站并不安全。

localhost:3000/home，页面本来是登陆以后才访问的，现在我们不要登陆，直接在浏览器输入也可访问。

页面报错了，提示%=user.username %变量出错。