Node.js(day4)

占位,更新中...

一、一些小问题 1.文件操作路径和模块读取路径的问题

我们使用fs核心模块系统进行文件操作时一般这样书写路径

fs.readFile('./views/index.html');//读取views目录下的idnex.html文件

我们使用require()进行自定义模块加载时的路径一般这样写

require('js/main.js');//加载js目录下的main.js

注意区分两者的区别,./的含义是相对路径,代表当前目录。文件操作路径不可以省略,而模块读取路径可以省略。另外如果忽略.写成'http://www.likecs.com/',那么/代表的是磁盘根目录。

2.让服务器自动重启的第三方模块nodemon

每次都要更新js后都需要手动重新启动服务器,比较麻烦,我们可以使用nodemon第三方模块来实现服务器自启动。

安装nodemon

npm insatll --save nodemon -g

使用
在命令行中使用nodemon代替node命令即可:

Node.js(day4)

当执行的js被执行保存时服务器就会重新启动。

二、在express中使用art-template

art-template专门为express配套了第三方模块:express-art-template,可参考官方文档进行使用:express-art-template

安装

npm insatll --save art-template npm insatll --save express-art-template

注册模板引擎

//引入模块 var express = require('express'); var template = require('express-art-template'); var app = express(); //在express中注册模板引擎 app.engine('.html',template);

使用app.engine(ext,callback)方法来注册模板引擎。callback是使用的模板引擎,ext是文件后缀。即当向页面呈现后缀为.ext的文件时,将使用指定的模板引擎进行渲染之后再呈现视图。

使用

app.get('http://www.likecs.com/',(req,res) => { res.render('./index.html',{comments:comments}); });

res.render(view [, locals] [, callback])方法就是上面说的呈现的视图的方法,即将某文件发送到页面上,一般就是html文件。
view是字符串,表示文件的路径;locals是一个对象,其属性定义了视图中的变量,模板引擎就会在内部根据传入的参数进行渲染;callback(err,html)是一个回调函数,err为错误对象,html为将要呈现是字符串。

注意
上面的视图资源路径为./index.html,但其实找的是views/index.html。这是express默认的规则,如果没有指定视图资源路径,默认查找views目录下的文件。如果需要自定义视图资源路径,请使用:

//设置views路径,可以传入单个目录或数组目录,查找时按照数组顺序查找 app.set('views',dir | dirArr) 三、案例:使用express实现留言板 1.express替代http

在之前的文章Node(2)中有一个留言板的案例,之前是使用http核心模块来实现的,现在我们使用express来实现。(html代码在之前的文章中,可自取)

var express = require('express'); //服务器 var app = express(); app.listen(8080,function(){ console.log('server running at 8080'); }); var comments = []; //注册art-template模板引擎 app.engine('html', require('express-art-template')); //配置静态资源 app.use('/public',express.static('./public')); //处理get请求 app.get('http://www.likecs.com/',(req,res) => { res.render('./index.html',{comments:comments},function(err,html){ res.send(html); }); }); app.get('/post',(req,res) => { res.render('./post.html'); }); app.get('/addComment',(req,res) => { //获取get提交的参数==>相当于使用url.parse(req.url,true).query; var query = req.query; query.dateTime = new Date().toLocaleString(); comments.unshift(query); //重定向==>相当于res.statusCode=302;res.setHeader('Location','http://www.likecs.com/') res.redirect(302,'http://www.likecs.com/'); });

显而易见,之前的js代码有60余行,现在的js代码只有30余行。值得注意的几个点:

我们在使用http核心模块时,还需要手动引入fs模块,art-template模块。现在使用了express之后不需要再手动引用,因为express内部会自动引用。

之前的页面渲染逻辑是:fs读取html文件 --> 使用art-template的render()对读取的字符串进行渲染 --> 发送到页面。

现在的页面渲染逻辑是:使用app.engine()注册模板引擎 --> 使用res.render()渲染页面并显示。

其实express内部操作和我们之前的没有太大差别,但框架的这种封装特性极大地提高了我们的开发效率,然我们能更专注于业务。

还有简化操作的api比如:req.query()其实就是之前的url.parse(req.url,true).query;;而res.redirect()是简化后的重定向。

2.post提交表单的处理

对于get提交,我们使用req.request即可获得提交的参数对象,但express没有提供post提交的参数获取的api。所以如果我们是post提交表单,就需要像之前一样使用req.on('data',backcall(postdata))来接受数据,且接受的postdata数据还需要进行解码,也是十分麻烦。所以这里我们推荐使用另一个第三方插件body-parser。

安装 body-parser

npm install body-parser --save

在express中使用body-parser

//引入模块 var bodyParser = require('body-parser'); //使用 app.use(bodyParser.urlencoded({extended:false})); app.use(bodyParser.json());

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wpzpzf.html