node.js 10 Web框架Express 介绍,安装,静态页面,路由
ccwgpt 2024-09-23 04:34 25 浏览 0 评论
上一篇: node.js 09 MongoDB增删改查,聚合,连接池
前面介绍了node.js的文件模块,http server以及静态网站的创建。有了这些知识作为基础,我们可以了解一下node.js的Web框架了。
从Java一路过来的朋友可能觉得Web框架还是比较重量级的,比如最初的Struts到后来的Spring,中间Apache组织也有过一些其他的模板框架,总体而言无论是从使用还是学习来讲,都是需要花费较多时间的。对于大型应用而言,这个投入是值得的。如果需要在较短的时间开发小型web应用,就值得商榷了。
好在有了node.js的出现,出现了像Express这样的轻量级,灵活的web框架,中小型web应用的开发速度就有了飞速的提升。
node.js Web框架
Java的世界里,Spring的使用目前处于绝对优势。但是其他语言就不一样了,无论node.js还是python,都有多个web应用框架。尤其是node.js,web框架较多,业界甚至评出了10大node.js web框架。不过不要惊慌,万变不离其宗,很多node.js web框架都是在Express的基础上开发的。这也是为什么在我的node.js系列里一定会出现node.js。最近炙手可热的框架koa也是之前Express的一帮开发人员后来做的,后面我也会专门写一篇介绍Koa。
之所以介绍Express,一是因为很多node.js框架都是在Express基础上的,另一个原因是Express非常轻便,上手很快,快到做一个CRUD的时间可以缩短到几个小时或者更短。这让我想起若干年前,我在使用Java Blueprint EJB做一个CRUD用了大约2天时间,包括了服务器的配置,在不同的web server上调试。然而node.js不需要这些,因为http server 以及Application server都是程序员自己用node.js代码写的。从另一个层面来讲,真正的大型企业级应用,我个人不推荐node.js。小型轻量级应用,node.js是首选。
Express JS
Github上收获了47.7k个星,目前来看是下载量最多的node.js框架。我之前介绍的node.js博客系统Ghost使用的web框架就是Express。
通过Express可以提供静态网站服务,路由,中间件,以及与模板引擎配合使用。
Express JS安装运行
安装通过npm进行。
- 安装express "npm install express --save"
D:\Projects\nodejs\NodeDemo\forms>npm install express --save
npm WARN forms@1.0.0 No description
npm WARN forms@1.0.0 No repository field.
+ express@4.17.1
added 50 packages from 37 contributors and audited 127 packages in 11.149s
found 0 vulnerabilities
- 在第一步完成后,express就已经在本地安装完成。但是没办法像create-react-app那样创建程序框架。好在express有一个程序生成器,express-generator。通过命令"npm install express-generator -g"即可安装。
D:\Projects\nodejs\NodeDemo\forms>npm install -g express-generator
D:\Program Files\nodejs\node_global\express -> D:\Program Files\nodejs\node_global\node_modules\express-generator\bin\express-cli.js
+ express-generator@4.16.1
added 10 packages from 13 contributors in 6.346s
- 运行"express"命令创建项目文件
由于我们已经建好了forms项目目录,所以直接运行express就可以在目录下创建项目文件和子目录。如果项目目录没有创建号,可以运行"express <project>"。该命令会自动创建<project>目录,并在目录下创建相关子目录和文件。
D:\Projects\nodejs\NodeDemo\forms>express
warning: the default view engine will not be jade in future releases
warning: use `--view=jade' or `--help' for additional options
destination is not empty, continue? [y/N] y
create : public\
create : public\javascripts\
create : public\images\
create : public\stylesheets\
create : public\stylesheets\style.css
create : routes\
create : routes\index.js
create : routes\users.js
create : views\
create : views\error.jade
create : views\index.jade
create : views\layout.jade
create : app.js
create : package.json
create : bin\
create : bin\www
install dependencies:
> npm install
run the app:
> SET DEBUG=node10:* & npm start
注意我们在运行时,系统有提示“destination is not empty, continue? [y/N]”,直接输入"y"就好。这是因为我们在forms目录下创建,并且该目录下已有部分通过"npm -i"创建的项目文件。
- 运行"npm install"安装express相关依赖包
D:\Projects\nodejs\NodeDemo\forms>npm install
added 4 packages from 3 contributors, removed 2 packages, updated 16 packages and audited 141 packages in 12.091s
found 0 vulnerabilities
- 运行项目"npm start"
D:\Projects\nodejs\NodeDemo\forms>npm start
> forms@0.0.0 start D:\Projects\nodejs\NodeDemo\forms
> node ./bin/www
GET / 200 17.703 ms - 207
GET /stylesheets/style.css 200 5.473 ms - 111
此时,打开自己的浏览器,访问http://localhos:3000/即可显示express创建的项目的主页。
ExpressJS 静态页面处理
使用框架有一个好处,那就是很多底层的处理不需要自己通过代码一行一行敲,框架的价值在于可以提供很多封装好的接口。
在静态页面的处理上,我们不需要在通过fs模块读取文件,通过response返回给客户端。在express中,只需要调用response.render()方法,传入模板文件名称即可。
示例代码:<project>/routes/index.js
//引入express
var express = require('express');
var router = express.Router();
/* 获取静态页面 */
router.get('/', function(req, res, next) {
res.render('index', { title: 'Express' });
});
//导出抹开
module.exports = router;
上面的代码从express创建的项目的代码中抽取,可以看到返回静态页面只需要引入express模块,调用路由Router,然后通过get方法,调用response.render()读取到index模板文件,将该静态模板文件返回客户端即可。注意,在这里有一个{title:'Express'}是模板中的参数,我们后面会介绍。
短短数行代码,没有绕人的逻辑,静态页面处理就完成了。
ExpressJS 路由
在上面的静态页面处理过程中,我们已经使用了路由Router。路由的具体使用方法如下:
- 在入口文件app.js中引入实际处理的路由。比如我们实际处理静态页面index的路由是<project>/routes/index.js, 那么在app.js中我们可以通过下列代码引入index 路由router
var indexRouter = require('./routes/index');
- 设定静态页面/模板目录
app.set('views', path.join(__dirname, 'views'));
......
//中间省略数行代码
......
app.use(express.static(path.join(__dirname, 'public')));
这里的__dirname表示当前目录,这行代码指定了静态页面/模板的目录。
3.通过app.use指定相关路径的处理路由
app.use('/', indexRouter);
这里表示,当访问网站时,系统会使用index路由处理,即<project>/routes/index.js。
而前面我们讲到过在index.js中,系统调用了res.render()方法传入模板文件,即返回浏览器静态页面。
ExpressJS 动态页面处理
通过res.send()方法进行。
router.get('/', function(req, res, next) {
res.send('respond with a resource');
});
示例代码可以查看<project>/routes/users.js
这就是处理路径/users的路由,将路由信息在app.js中写入即可。
var usersRouter = require('./routes/users');
app.use('/users', usersRouter);
当用户通过浏览器访问http://localhost:3000/users时,系统会调用<project>/routes/users.js中的response.get()方法返回信息给客户端。
总结
上面介绍了expressJS以及安装,静态页面,路由和动态页面的处理。
后面会介绍expressJS以及相关的模板引擎以及中间件。
如果有什么问题,欢迎朋友们留言讨论。
相关推荐
- 团队管理“布阵术”:3招让你的团队战斗力爆表!
-
为何古代军队能够以一当十?为何现代企业有的团队高效似“特种部队”,有的却松散若“游击队”?**答案正隐匿于“布阵术”之中!**今时今日,让我们从古代兵法里萃取3个核心要义,助您塑造一支战斗力爆棚的...
- 知情人士回应字节大模型团队架构调整
-
【知情人士回应字节大模型团队架构调整】财联社2月21日电,针对原谷歌DeepMind副总裁吴永辉加入字节跳动后引发的团队调整问题,知情人士回应称:吴永辉博士主要负责AI基础研究探索工作,偏基础研究;A...
- 豆包大模型团队开源RLHF框架,训练吞吐量最高提升20倍
-
强化学习(RL)对大模型复杂推理能力提升有关键作用,但其复杂的计算流程对训练和部署也带来了巨大挑战。近日,字节跳动豆包大模型团队与香港大学联合提出HybridFlow。这是一个灵活高效的RL/RL...
- 创业团队如何设计股权架构及分配(创业团队如何设计股权架构及分配方案)
-
创业团队的股权架构设计,决定了公司在随后发展中呈现出的股权布局。如果最初的股权架构就存在先天不足,公司就很难顺利、稳定地成长起来。因此,创业之初,对股权设计应慎之又慎,避免留下巨大隐患和风险。两个人如...
- 消息称吴永辉入职后引发字节大模型团队架构大调整
-
2月21日,有消息称前谷歌大佬吴永辉加入字节跳动,并担任大模型团队Seed基础研究负责人后,引发了字节跳动大模型团队架构大调整。多名原本向朱文佳汇报的算法和技术负责人开始转向吴永辉汇报。简单来说,就是...
- 31页组织效能提升模型,经营管理团队搭建框架与权责定位
-
分享职场干货,提升能力!为职场精英打造个人知识体系,升职加薪!31页组织效能提升模型如何拿到分享的源文件:请您关注本头条号,然后私信本头条号“文米”2个字,按照操作流程,专人负责发送源文件给您。...
- 异形柱结构(异形柱结构技术规程)
-
下列关于混凝土异形柱结构设计的说法,其中何项正确?(A)混凝土异形柱框架结构可用于所有非抗震和抗震设防地区的一般居住建筑。(B)抗震设防烈度为6度时,对标准设防类(丙类)采用异形柱结构的建筑可不进行地...
- 职场干货:金字塔原理(金字塔原理实战篇)
-
金字塔原理的适用范围:金字塔原理适用于所有需要构建清晰逻辑框架的文章。第一篇:表达的逻辑。如何利用金字塔原理构建基本的金字塔结构受众(包括读者、听众、观众或学员)最容易理解的顺序:先了解主要的、抽象的...
- 底部剪力法(底部剪力法的基本原理)
-
某四层钢筋混凝土框架结构,计算简图如图1所示。抗震设防类别为丙类,抗震设防烈度为8度(0.2g),Ⅱ类场地,设计地震分组为第一组,第一自振周期T1=0.55s。一至四层的楼层侧向刚度依次为:K1=1...
- 结构等效重力荷载代表值(等效重力荷载系数)
-
某五层钢筋混凝土框架结构办公楼,房屋高度25.45m。抗震设防烈度8度,设防类别丙类,设计基本地震加速度0.2g,设计地震分组第二组,场地类别为Ⅱ类,混凝土强度等级C30。该结构平面和竖向均规则。假定...
- 体系结构已成昭告后世善莫大焉(体系构架是什么意思)
-
实践先行也理论已初步完成框架结构留余后人后世子孙俗话说前人栽树后人乘凉在夏商周大明大清民国共和前人栽树下吾之辈已完成结构体系又俗话说青出于蓝而胜于蓝各个时期任务不同吾辈探索框架结构体系经历有限肯定发展...
- 框架柱抗震构造要求(框架柱抗震设计)
-
某现浇钢筋混凝土框架-剪力墙结构高层办公楼,抗震设防烈度为8度(0.2g),场地类别为Ⅱ类,抗震等级:框架二级,剪力墙一级,混凝土强度等级:框架柱及剪力墙C50,框架梁及楼板C35,纵向钢筋及箍筋均采...
- 梁的刚度、挠度控制(钢梁挠度过大会引起什么原因)
-
某办公楼为现浇钢筋混凝土框架结构,r0=1.0,混凝土强度等级C35,纵向钢筋采用HRB400,箍筋采用HPB300。其二层(中间楼层)的局部平面图和次梁L-1的计算简图如图1~3(Z)所示,其中,K...
- 死要面子!有钱做大玻璃窗,却没有钱做“柱和梁”,不怕房塌吗?
-
活久见,有钱做2层落地大玻璃窗,却没有钱做“柱子和圈梁”,这样的农村自建房,安全吗?最近刷到个魔幻施工现场,如下图,这栋5开间的农村自建房,居然做了2个全景落地窗仔细观察,这2个落地窗还是飘窗,为了追...
- 不是承重墙,物业也不让拆?话说装修就一定要拆墙才行么
-
最近发现好多朋友装修时总想拆墙“爆改”空间,别以为只要避开承重墙就能随便砸!我家楼上邻居去年装修,拆了阳台矮墙想扩客厅,结果物业直接上门叫停。后来才知道,这种配重墙拆了会让阳台承重失衡,整栋楼都可能变...
你 发表评论:
欢迎- 一周热门
- 最近发表
- 标签列表
-
- MVC框架 (46)
- spring框架 (46)
- 框架图 (58)
- bootstrap框架 (43)
- flask框架 (53)
- quartz框架 (51)
- abp框架 (47)
- jpa框架 (47)
- laravel框架 (46)
- express框架 (43)
- scrapy框架 (52)
- beego框架 (42)
- java框架spring (43)
- grpc框架 (55)
- 前端框架bootstrap (42)
- orm框架有哪些 (43)
- ppt框架 (48)
- 内联框架 (52)
- winform框架 (46)
- gui框架 (44)
- cad怎么画框架 (58)
- ps怎么画框架 (47)
- ssm框架实现登录注册 (49)
- oracle字符串长度 (48)
- oracle提交事务 (47)