位置: 编程技术 - 正文

Nodejs Express4.x开发框架随手笔记

编辑:rootadmin

推荐整理分享Nodejs Express4.x开发框架随手笔记,希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:,内容如对您有帮助,希望把文章链接给更多的朋友!

Express: &#;web application framework for&#;Node.js&#;Express 是一个简洁、灵活的 node.js Web 应用开发框架, 它提供一系列强大的特性,帮助你创建各种 Web 和移动设备应用。

目录

此文重点介绍Express4.x(具体是4..4)的开发框架,其中还会涉及到Mongoose,Ejs,Bootstrap等相关内容。

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

开发环境:

Ubuntu

MonogoDB: v2.6.4

nodejs:v0..2

npm 2.1. ( 如果nodejs安装的时候是1.2.版本,本文升级到了2.x版本)

1. 建立工程

进入工程目录

mkdir workplace

cd workplace

全局安装express,express作为命令被安装到了系统中.

npm install -g express

查看express版本

express -V

注意:在express4.x版本中已经不含有express命令了。

需要安装 express-generator

npm install express-generator -g

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

使用express命令创建工程,并支持ejs

hadoop@sven:~/workspace/nodeJs$ express -e nodejs-demo

create : nodejs-demo (项目名)create : nodejs-demo/package.json (项目包的信息)create : nodejs-demo/app.js (主程序)create : nodejs-demo/public (公开目录)create : nodejs-demo/public/imagescreate : nodejs-demo/public/javascriptscreate : nodejs-demo/public/stylesheetscreate : nodejs-demo/public/stylesheets/style.csscreate : nodejs-demo/routes (路由目录,以后在这个目录下开发程序,然后在app.js里use)create : nodejs-demo/routes/index.jscreate : nodejs-demo/routes/users.jscreate : nodejs-demo/views (视图目录,视图模板文件等)create : nodejs-demo/views/index.ejscreate : nodejs-demo/views/error.ejscreate : nodejs-demo/bincreate : nodejs-demo/bin/www (启动文件,用于启动app.js)install dependencies:$ cd nodejs-demo && npm installrun the app:$ DEBUG=nodejs-demo ./bin/www

项目创建成功。

根据上述提示安装依赖:

根据提示启动web:

不过我们这里不打算使用该方法启动程序。原因是我们在开发过程中需要使用nodemon这么一个工具。nodemon用于动态识别开发过程中项目的改变,然后动态加载(这是Eclipse种开发java web类似)。该工具是开发web的必备啊

安装nodemon:

npm install nodemon -g

那么为什么我们上面不使用./bin/www脚本呢?

原因是nodemon ./bin/www 这样是没有办法识别项目的改动。(我个人实验的,如有知道的大牛,望赐教)

修改app.js:

把最有一行//module.exports = app;注释掉

换成:app.listen();

使用下面命令启动app.js主程序:

hadoop@sven:~/workspace/nodeJs/nodejs-demo$ nodemon app.js

然后修改程序,看看是否会动态加载。会有下面提示:

1 Dec :: ? [nodemon] restarting due to changes…1 Dec :: ? [nodemon] starting `node app.js`

表示生效。

测试:

本地的端口被打开,通过浏览器访问: localhost:

2. 目录结构

./drwxrwxr-x 5 hadoop hadoop 月 1 : ../-rw-rw-r? 1 hadoop hadoop 月 1 : app.js-rw-r?r? 1 hadoop hadoop 月 1 : .app.js.swpdrwxr-xr-x 2 hadoop hadoop 月 1 : bin/drwxrwxr-x 9 hadoop hadoop 月 1 : node_modules/-rw-rw-r? 1 hadoop hadoop 月 1 : package.jsondrwxr-xr-x 5 hadoop hadoop 月 1 : public/drwxr-xr-x 2 hadoop hadoop 月 1 : routes/drwxr-xr-x 2 hadoop hadoop 月 1 : views/

目录介绍:

node_modules, 存放所有的项目依赖库。(每个项目管理自己的依赖,与Maven,Gradle等不同)package.json,项目依赖配置及开发者信息app.js,程序主入口public,静态文件(css,js,img)routes,路由文件(MVC中的C,controller)Views,页面文件(Ejs模板)nodejs-demo/bin/www (启动文件,用于启动app.js)

打开app.js查看内容:

4. Ejs模板使用

让ejs模板文件,使用扩展名为html的文件。

修改:app.js

var ejs = require('ejs'); //引入ejs。重新安装依赖>app.engine('.html', ejs.__express);app.set('view engine', 'html'); // app.set('view engine', 'ejs');重命名:views/*.ejs 为 views/*.html

访问localhost:正确

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

5. 增加Bootstrap界面框架

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

复制到public/stylesheets目录

bootstrap.min.cssbootstrap-responsive.min.css

复制到public/javascripts目录

bootstrap.min.jsjquery-1.9.1.min.js

接下来,我们把index.html页面切分成3个部分:header.html, index.html, footer.html

header.html, 为html页面的头部区域index.html, 为内容显示区域footer.html,为页面底部区域

header.html

访问localhost:正确。

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

Nodejs Express4.x开发框架随手笔记

并已经引入了bootstrap界面框架。

6. 路由功能

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

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

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

注:get为get请求,post为post请求,all为所有针对这个路径的请求

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

创建views/login.html和views/home.html两个文件

login.html

修改index.html,增加登陆链接

index.html

路由及页面我们都写好了,快去网站上试试吧。

7. Session使用

从刚来的例子上面看,执行exports.doLogin时,如果用户名和密码正确,我们使用redirect方法跳转到的home

res.redirect('/home');

执行exports.home时,我们又用render渲染页面,并把user对象传给home.html页面

res.render('home', { title: 'Home',user: user});

为什么不能在doLogin时,就把user对象赋值给session,每个页面就不再传值了。

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

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

像PHP的web服务器,是交行CGI的程序处理,CGI是无状态的,所以一般用cookie在客户的浏览器是维护用户的状态。但cookie在客户端维护的信息是不够的,所以CGI应用要模仿用户session,就需要在服务器端生成一个session文件存储起来,让原本无状态的CGI应用,通过中间文件的方式,达到session的效果。

Nodejs的web服务器,也是CGI的程序无状态的,与PHP不同的地方在于,单线程应用,所有请求都是异步响应,通过callback方式返回数据。如果我们想保存session数据,也是需要找到一个存储,通过文件存储,redis,Mongdb都可以。

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

app.js文件

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

需要添加中间件connect、session-mongoose。

其中session-mongoose是用于连接mongodb数据库。然后自动写入session信息到数据库中(也可以用mongoose中间件,但是要自己实现session的写入)

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

注:app.js文件有顺序要求,一定要注意!!!

安装session-mongoose依赖库

npm install connect

npm install session-mongoose

npm install session-mongoose

安装有错误但是没关系。

访问: 是通过app.js中app.use的res.locals变量,通过框架进行的赋值。

注:这个session是express4..4的写法,与express4之前的版本是不一样的。

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

nodejs-mongodbnodejs-mongodb

由于上面配置的 cookie:{maxAge:} //expire session in seconds过期时间,因此你会看到mongodb里面的数据过一段时间就被清除了。参考:

Mongoose: 页面提示

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

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

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

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

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

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

修改login.html页面,<%- message %>

修改routes/index.js,增加req.session.error

让我们来看看效果: 输入错误的和密码, 用户名:dad,密码:da

boostrap-nodejs

9. 页面访问控制

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

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

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

GET /home&#;user==a msTypeError: D:workspaceprojectnodejs-demoviewshome.html:| <% include header.html %>>> 2| <h1>Welcome <%= user.username %>, 欢迎登陆!!</h1>3| <a claa="btn" href=" <% include header.html %>Cannot read property 'username' of nullat eval (eval at <anonymous> (D:workspaceprojectnodejs-demonode_modulesejslibejs.js:at eval (eval at <anonymous> (D:workspaceprojectnodejs-demonode_modulesejslibejs.js:at D:workspaceprojectnodejs-demonode_modulesejslibejs.js::at Object.exports.render (D:workspaceprojectnodejs-demonode_modulesejslibejs.js::at View.exports.renderFile [as engine] (D:workspaceprojectnodejs-demonode_modulesejslat View.render (D:workspaceprojectnodejs-demonode_modulesexpresslibview.js::8)at Function.app.render (D:workspaceprojectnodejs-demonode_modulesexpresslibapplicatiat ServerResponse.res.render (D:workspaceprojectnodejs-demonode_modulesexpresslibresat exports.home (D:workspaceprojectnodejs-demoroutesindex.js::8)at callbacks (D:workspaceprojectnodejs-demonode_modulesexpresslibrouterindex.js:

这个页面被打开发,因为没有user.username参数。我们避免这样的错误发生。

还记录路由部分里说的get,post,all的作用吗?我现在要回到路由配置中,再做点事情。

修改app.js文件

app.get('/',routes.index);app.route('/login').all(notAuthentication).get(routes.login).post(routes.doLogin);app.route('/logout')app.get('/',routes.index);app.route('/login').all(notAuthentication).get(routes.login).post(routes.doLogin);app.route('/logout').get(authentication).get(routes.logout);app.route('/home').get(authentication).get(routes.home);

访问控制:

/ ,谁访问都行,没有任何控制/login,用all拦截所有访问/login的请求,先调用authentication,用户登陆检查/logout,用get拦截访问/login的请求,先调用notAuthentication,用户不登陆检查/home,用get拦截访问/home的请求,先调用Authentication,用户登陆检查修改app.js文件,增加authentication,notAuthentication两个方法

配置好后,我们未登陆,直接访问localhost:/home时或者localhost:/logout,就会跳到/login页面

登录后, 访问localhost:/login 则直接跳到/home页面

到此,express4 相关内容到此为止。

以上内容是小编给大家分享的Nodejs Express4.x开发框架随手笔记,希望大家喜欢。

基于nodejs+express(4.x+)实现文件上传功能 Nodejs是一个年轻的编程框架,充满了活力和无限激情,一直都在保持着快速更新。基于Nodejs的官方Web开发库Express也在同步发展着,每年升级一个大版本

浅析node连接数据库(express+mysql) 操作是在ubuntu系统的下环境,简单记录一下过程。首先用apt-get安装数据库,键入命令sudoapt-getinstallmysql-server,一路回车,然后在一个界面设置一下数据库

win7下安装配置node.js+express开发环境 1.安装node.js。进入官网的下载地址:

标签: Nodejs Express4.x开发框架随手笔记

本文链接地址:https://www.jiuchutong.com/biancheng/370642.html 转载请保留说明!

上一篇:Nodejs的express使用教程(nodejs的express框架详解)

下一篇:基于nodejs+express(4.x+)实现文件上传功能(基于是什么意思)

  • 初级职称经济法目录
  • 公车私车税收区别
  • 企业增资会计处理流程
  • 合资公司注册成立流程
  • 购入库存商品未付款怎么做账
  • 外商投资企业与内资合资是国企吗
  • 公允价值变动计入其他综合收益
  • 结转已销售材料成本会计分录
  • 合并会计报表长期股权投资
  • 资产处置收益结转损益
  • 开给天猫的服务费分录如何做
  • 计提企业年度所得税
  • 银行客户专用回单分录
  • 搅拌站是自用的账务如何做分录?
  • 增值税农产品抵扣政策
  • 增值税发票收款人复核人空白可以吗
  • 免税发票备注栏
  • 已认证未抵扣的发票,又做了红字,如何处理
  • 继承或赠与所得的房产
  • 私自安装路灯违法吗?
  • 房开企业增值税确认收入时间
  • 售后回租 出租方
  • 水电费的增值税计入什么科目
  • 增值税小规模纳税人优惠政策
  • 进项大于销项下月可不可以抵扣
  • bois如何设置启动项
  • 一般纳税人销售自己使用过的汽车
  • 医疗机构医疗服务自查报告怎么写
  • 外贸综合服务企业代办退税
  • 非经营业务
  • 资金运动包括哪几个方面
  • php中如何获取数组的长度
  • 格拉纳达的阿尔罕布拉宫用什么材料制成?
  • 以前年度损益调整
  • 定额发票累计领取怎么算
  • h5支付功能
  • tmux复制粘贴
  • js相关知识
  • 应发工资与应税的区别
  • 资产负债表和利润表的勾稽关系
  • python的元组有什么用
  • sqlserver2008分页查询
  • mysql的常用命令
  • mysql卡住了
  • 金税四期怎么监控个人账号
  • 收到失业保险稳岗补贴怎么做会计分录
  • 应付职工薪酬的账务处理
  • 长期待摊费用是摊销费用吗
  • 公司年度汇算清缴费用多少
  • 收到实务返利的发票
  • 信用卡逾期滞纳金怎么收取
  • 零申报资产负债表填0合适吗
  • 营业收入怎么确定
  • 运输费增值税专用发票
  • 资产负债表中的固定资产是原值还是净值
  • 培训费发票必须开吗
  • 成本暂估入帐如何做分录
  • win2000系统安装教程
  • linux进程管理实验总结
  • win10 20h2官方下载
  • xp系统怎么调性能
  • 进程 内核栈
  • xp电脑关机后自动重启是什么原因
  • lsass.exe是什么病毒
  • 从五方面解析Linux防火墙框架问题
  • linux修复工具
  • suse linux 12 sp5
  • jquery动态添加
  • 用原生js写项目
  • js 操作excel
  • Android:wpa_supplicant决定选择哪种驱动
  • jquery的点击事件怎么写
  • 网卡流量怎么计算
  • 安卓监听事件
  • 专项扣除赡养老人是什么意思
  • 国家个税app讨要工资流程怎么操作
  • 铅球七米
  • 湖南耕地占用税标准
  • 武汉市房产证契税 2023
  • 免税发票可以抵多少税
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设