《Node应用程序构建——使用MongoDB和Backbone》一2.2 Express-阿里云开发者社区

开发者社区> 开发与运维> 正文

《Node应用程序构建——使用MongoDB和Backbone》一2.2 Express

简介:

本节书摘来自异步社区《Node应用程序构建——使用MongoDB和Backbone》一书中的第2章,第2.2节,作者【美】Mike Wilson,更多章节内容可以访问云栖社区“异步社区”公众号查看

2.2 Express

Node应用程序构建——使用MongoDB和Backbone
本书中应用程序大量用到Express框架。依赖于Connect HTTP服务器框架,Express提供了视图渲染和一种描述路由的语言。

要安装Express,只要在工作目录中使用npm:npm install express。

例2-1利用Express构建了一个简单且非常实用的服务器。首先,通过调用express库中的express()函数对app变量初始化。require命令指示Node导入express库,并把它分配给一个局部变量,从而将它的功能提供给当前命名空间。


595e7c28af4bb1e6c5ca3ae57557d34ef3b02e33

应用初始化时,定义了3个路由。

/stooges/[name]

期待一个stooge(配角)的名字作为输入。

/stooges/

如果上一个路由提供的名字未找到,给出反馈信息。

/

一个默认的路由,用于访问应用程序的主页。

在第1个路由,Express会比较提供的配角名称是否为“larry”、“curly”或“moe”,并打印信息。在下一个路由中,Express显示一条消息说明没有找到配角名称。第3个路由中,显示默认的“hello world”。

等一下,第1个路由中的next参数是从哪里来的?它又是什么?实际上,next是指一个函数。next命令指示Express尝试处理匹配当前请求的下一个路由。在这个例子中,输入URL/stooges/ 会被第一个路由(/stooges/:name?)处理,而不是被第2个路由(/stooges)处理。由于没有提供名字,switch语句逻辑会跳转到默认情况下,此时next()函数会被调用。下一个路由(/stooges)包含了预期的响应。

:name参数之后的问号表明name是一个可选的输入,即使不提供name,这个路由也将被加载。


ffc0b1b3a782559b6e69e2c1ae2ae44eab2705a2

在switch语句中,使用了一个三元操作符作为缩写的if/else语句:name ? name. toLowerCase() : ''。这相当于一个很长的代码块,检查变量name是否存在,如果存在,返回小写的字符串,否则返回一个空字符串。


5189d0069b2e921cc46235abda5922079269d02b

模板
模板让你将展现信息从程序代码中分离出来,使你的项目文件更易整理,并渲染出复杂结构的网页。虽然本书主要关注用纯JavaScript来创建和显示视图,但有时候你也会想用Express的模板功能来生成网页,或者只是为了更容易在一个网页中引导所有的JavaScript文件。我选择Jade作为引擎,因为它在概念上类似于CSS,能产生清晰、简洁的代码。

要安装Jade模板引擎,在工作目录中使用NPM命令。


13160ce33c1fc365fd9d6a82ba87b19a9545bc99

例2-2在例2-1的基础上增加了Jade模板支持。3个路由都使用了res.send代替直接在屏幕上打印文字。Express被告知以.jade作为后缀的文件来渲染内容:要么用stooges.jade模板来渲染配角名字列表(或没有名字),要么用默认的index.jade来渲染网站的根。


121a45a5f2b143ee7b1767fc8bf75e6992785ac8

另外新增的是包含app.set('views'...)的3行代码。这个命令告诉Express所有视图都存放在命名为“views”的目录下,是相对于代码文件运行(-dirname)的下级目录。

虽然Jade是用来渲染视图的,但你可能已经注意到,代码中并没有提到或实例化Jade。这是因为Express渲染命令会负责加载任何需要的模板模块,在这个例子中是Jade。如果你没有安装Jade,你的应用程序将会在进行页面渲染时停止运行,并抛出调用栈。

例2-3展示了使用Jade的整个页面布局。这是围绕“真正”页面的部分,它们是网站每一个页面上的标题信息,开放的标签和元数据。body标签将包含单个视图渲染的布局,Express渲染模板时将会包含这个布局。

例2-3 Jade布局(layout.jade)
!!! 5


814bc271b27e917aaa0886292e18f2c8e01b8290

第一行“!!! 5”表明文档类型是HTML5。也可以写成doctype html,但谁高兴打那么多字?

例2-4中包含的模板应该保存在views/index.jade中。它包含网站根内容:没什么消息比一个“hello world”更简单。这个模板的第一行扩展了例2-3中创建的layout.jade模板,这将导致用户的网络浏览器渲染布局的内容。因为h1标签嵌套在模板的block content元素中,Jade知道它应该在布局中的block content被定义后再被渲染。

例2-4 Jade风格的索引主页(index.jade)


519d650e56d3a1a0825d736c961f5f7fb4fe0a42

你可能会注意到,例2-3的布局还包含一个block元素称为scripts,它没有被index模板使用。这个脚本块在网页浏览器中显示为空白。可以在你的模板中添加或删除任何block内容,为页面布局留下极大的灵活性。

例2-5在Jade模板中引入了条件逻辑。如果一个stooge变量被传递到模板,它将显示出这个配角的名字,否则它将显示一般的“没有找到”消息。

例2-5 Jade风格的新stooges页面(stooges.jade)


73d18005371f22bd39cecd2e00a4c748d96196c0

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

分享:
开发与运维
使用钉钉扫一扫加入圈子
+ 订阅

集结各类场景实战经验,助你开发运维畅行无忧

其他文章