express是node.js的框架,node.js的好坏就不多说,到处都有的看,更何况像我如今此等入门级,就简单分享一下初次体验express的一些心得体会,仅仅是一些基础知识,希望大神指点,菜鸟则希望有所帮助,共同进步啊。
node.js的简单配置已经在前面的node.js+socket.io配置这篇博文中提到,就不多说了,其实配置express也是十分简单,这里推荐一个比较好的IDE,webStorm,下载完毕后新建一个express工程即可,对于初学者或者对于html有所接触的同学来说,可以选择ejs模板,一般默认会选择jade,生成工程之前会提示选择,不用担心,这还是很简单的。工程建好之后,整体框架也帮我们建好了,程序的入口是app.js,routes目录下是页面逻辑,views目录下是模板文件,等等。
接下来介绍一下这些文件的具体用处吧,
一、app.js:
app.js中首先var express = require("express")等与node.js相同的方式引入一系列的文件,这里是由express创建服务器,因为express封装了node.js中的http协议,创建的方式与node.js是一致的,express.createServer(),再在express.configure()中配置中间件,express的中间件很多,其实在我的理解就是第三方包,不明白的可以去请示google大神或者百度。配置中间件有三种环境,通用环境,开发环境以及生成环境,我们这里当然还都是通用环境,现在讲讲不知所云,建立了项目就一目了然了,其实很清晰的。接下来就是路由了,express中的路由方式遵循了REST(表征状态转移)风格的路由方式,并定义了8种标准的方法,常用的有get,post,put,delete等等,以get方式举例,app.get("/",funName);将路径‘/’映射到相应的函数,并且该路径指定了只能接受get方式的请求。其中还值得一提的是all方式,这种方式能够接受该路径所有方式的请求,all请求方式有利于实现中间件,实现路由控制权的转移,
app.js
var express = require("express")
,routers = require("./routers");//默认加载routers目录下的index.js文件
...
app.configure(function(){
app.use(...)
...
})
app.all('/comment',routers .commentByVistor);
app.get('/comment/user',routers .commentByUser);
......
routers/index.js如下:
exports.commentByVistor = function(req,res,next){
if(!req.params.user){
res.send("游客评论");
}else{
next();
}
}
exports.commentByUser = function(req,res){
var user = req.params.user;
res.send("user:"+user+"评论");
}
以上是一个简单的游客或者用户评论的例子,注意app.all中的路径与get中的路径,当用户评论时首先都会进all这种方式的路由,该方法中判断是否已经登录,若未登录则直接处理,否则以next()方法转移路由到下一个。例如url是/comment/user1,则先进入all路由,由于user不为空,执行next()进入下一个路由中,即执行commentByUser方法。
二、index.js
如上代码所示,index.js定义了一系列路由代码,可以接收用户请求后渲染模板页面返回给客户端,代码如下:
exports.index = function(req, res){
res.render('index', { title: 'Express' });
};
这段代码表示渲染index.ejs模板,并传入title变量,以下是index.ejs模板内容
<!DOCTYPE html>
<html>
<head>
<title><%= title %></title>
<p>welcome to <%= title %></p>
</body>
</html>
页面中的title被传入的title变量替换,那接下来就简单介绍一下ejs文件了
三、index.ejs
ejs文件全称embedded javascript,是一种模板文件,可以直接在html文件中嵌入代码,例如上面的title,
ejs文件默认继承一个layout.ejs文件,该文件可以是这种形式:
<!DOCTYPE html>
<html>
<head>
<title><%= title %></title>
<link rel='stylesheet' href='/stylesheets/style.css' />
</head>
<body>
<%-body%>
</body>
</html>
继承了layout.ejs的文件就可以这样写了,index.js
<h1><%= name %>发布的心情</h1>
<p><%= message %></p>
实现过程中将其中的<%-body%>替换为我们的目标文件中index.js内容,我们的很多页面样式都是大同小异,那么我们可以定义一个样式框架,然后让内容继承这个整体样式框架,方便我们开发风格统一的界面。
当我们需要禁用页面继承机制的时候,可以再app.configure中显式禁用,app.set('view options',{"layout":false});我们可以继承默认的layout.ejs文件,也可以自定义父类模板样式文件例如base.ejs,然后在res.render('index',{title:"",layout:"base"});即可实现页面继承自base.ejs这个框架页面。
有时候我们会发现这个继承机制不成功,当我们的继承没有效果的时候,检查一下当前express的版本,在cmd命令框中输入express -V,若express版本是3.x,那么默认是不支持这个功能的,我们需要加载partials组件,这是帮助我们实现这个机制的第三方包,进入当前工程目录,npm install express-partials,加载成功后node_module目录下会新增一个express-partials文件夹,接下来我们通过partials = require(‘express-partials’)引入文件,并在configure中添加app.use(partials());
express入门级分享就到这里了,继续研究,继续分享,欢迎大神指点。