nodejs 图解express+supervisor+ejs的用法(推荐)

 更新时间:2017年09月08日 08:27:24   投稿:jingxian  
下面小编就为大家带来一篇nodejs 图解express+supervisor+ejs的用法(推荐)。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧

通过node js自带的http模块搭建了一个简易的服务器,实际在开发中,一般用的是express框架,本文我们就来讲讲项目开发中必备不可少的几样东西:

•服务器( express )

•路由( express.Router )

•模板引擎( ejs )

•当然再加上数据库,就可以完成一个mvc的web应用了,数据库的用法,后期我会写一个项目

一、首先,新建一个项目文件夹( ghostwu ),在命令行下切换到该目录,用npm init --yes 初始化package.json文件

安装express: npm install express --save

二、新建index.js文件,输入以下代码

var express = require('express');
var app = express();

app.get('/', function(req, res) {
 res.send( 'welcome to study express -by ghostwu' );
}).listen( 8080 );

第一行,加载express模块

第二行,开启web服务器

第三行,web服务器监听8080端口, 当通过浏览器输入( http://localhost:8080 ) 就会看到这段信息:welcome to study express -by ghostwu

三、如果你写过node服务器,你就会发现一个问题,每次修改之后,都要重启服务器,一般来说,我们修改文件之后,保存,刷新网页就能看到修改,需要达到这样的效果,我们就要安装supervisor,这个相当于webpack的热加载,我们采用全局安装: npm install -g supervisor,安装完成之后,我们以后就这样运行服务器文件了: supervisor --harmony index

之后修改index.js文件,只要保存,刷新网页就能马上看到修改之后的结果了

四、增加路由处理,修改index.js文件,把代码修改成如下:

var express = require('express');
var app = express();
app.get('/', function(req, res) {
 res.send('hello, express');
});
app.get('/user/:name', function(req, res) {
 res.send('hello, ' + req.params.name);
});
app.get('/user/:name/age/:age', function(req, res) {
 res.send('info: user:' + req.params.name + ', age:' + req.params.age );
});
app.listen( 8080 );

http://localhost:8080/ ----> 显示hello, express

http://localhost:8080/user/ghostwu ----->显示hello, ghostwu

http://localhost:8080/user/ghostwu/age/22 ---->显示info: user:ghostwu, age:22

:name占位符: 用来接收user后面的值 :age占位符用来接收age后面的值, req.params后面获取的键名就是这个占位符

如果你学过php,那么就相当于下面这种get接收参数方式

xxx.php?user=ghostwu&age=22 -----> $_REQUEST['user'] $_REQUEST['age']

五、一般在项目中,路由是需要单独分离出来的,便于维护和扩展

新建routers,然后在下面创建index.js和info.js文件

index.js代码:

var express = require('express');
var router = express.Router();

router.get('/', function(req, res) {
 res.send('hello, express');
});

module.exports = router;

info.js代码:

var express = require('express');
var router = express.Router();

router.get('/:name', function(req, res) {
 res.send('hello, ' + req.params.name);
});
router.get('/:name/age/:age2', function(req, res) {
 res.send('info: user:' + req.params.name + ', age:' + req.params.age2 );
});

module.exports = router;

ghostwu这个目录下面的index.js文件代码为:

var express = require('express');
var app = express();
var indexRouter = require('./routers/index');
var infoRouter = require('./routers/info');

app.use('/', indexRouter);
app.use('/user', infoRouter);

app.listen(8080);

通过以上的代码,就完成了路由的分离,把 / 和 /user分别放在index.js,info.js文件,然后导出router对象,通过app.use找到对应的路由

六、ejs模板的应用

安装: npm install ejs --save

index.js文件:

var path = require('path');
var express = require('express');
var app = express();
var indexRouter = require('./routers/index');
var infoRouter = require('./routers/info');

//设置模板目录: views
app.set('views', path.join(__dirname, 'views'));

//设置模板引擎: ejs
app.set('view engine', 'ejs');
app.use('/', indexRouter);
app.use('/user', infoRouter);
app.listen(8080);

info.js文件

var express = require('express');
var router = express.Router();

router.get('/:name', function(req, res) {
 res.render( 'info', {
 name : 'ghostwu',
 age : 22,
 sex : 'man'
 });
});
module.exports = router;

第5行res.render渲染模板文件 info.ejs, 第二个参数就是数据

info.ejs文件

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
 </head>
 <body>
  用户信息:
  <hr>
  <ul>
   <li>用户名: <%=name%></li>
   <li>年龄: <%=age%></li>
   <li>性别: <%=sex%></li>
  </ul>
 </body>
</html>

<%=变量名%>读出数据

<% code %>:运行 JavaScript 代码,不输出
<%= code %>: 转义html标签
<%- code %>:不转义html标签

其他ejs用法,结合手册查下

以上这篇nodejs 图解express+supervisor+ejs的用法(推荐)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • 一文教你学会Nodejs中puppeteer的简单使用

    一文教你学会Nodejs中puppeteer的简单使用

    Puppeteer是一个控制headless Chrome的Node.js API ,是一个 Node.js库,在浏览器中手动完成的大多数事情都可以通过使用 Puppeteer完成,本文主要介绍了Puppeteer的简单使用,希望对大家有所帮助
    2024-01-01
  • 详解node child_process模块学习笔记

    详解node child_process模块学习笔记

    这篇文章主要介绍了详解node child_process模块学习笔记,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-01-01
  • nodejs+koa2 实现模仿springMVC框架

    nodejs+koa2 实现模仿springMVC框架

    这篇文章主要介绍了nodejs+koa2 实现模仿springMVC框架,本文通过实例图文相结合给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2020-10-10
  • Node.js使用多进程提高任务执行效率

    Node.js使用多进程提高任务执行效率

    在Node.JS中使用多进程非常简单,合理使用多进程,可以解放硬件的能力,让软件的运行效率得到肉眼可见的提升。本文详细讲解了Node.js使用多进程提高任务执行效率的方法,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2022-09-09
  • NodeJs实现定时任务的示例代码

    NodeJs实现定时任务的示例代码

    本篇文章主要介绍了NodeJs实现定时任务的示例代码,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-12-12
  • 详解npm和cnpm混用的坑

    详解npm和cnpm混用的坑

    有没有遇到过npm和cnpm一起用的时候出现奇奇怪怪的问题呢? 有没有遇到过cnpm在支付宝小程序上面安装包无效?本文就详解一下npm和cnpm混用的坑,感兴趣的可以了解下
    2021-07-07
  • Node.js API详解之 vm模块用法实例分析

    Node.js API详解之 vm模块用法实例分析

    这篇文章主要介绍了Node.js API详解之 vm模块用法,结合实例形式分析了Node.js API中vm模块基本功能、函数、使用方法及相关操作注意事项,需要的朋友可以参考下
    2020-05-05
  • node.js中的fs.fstat方法使用说明

    node.js中的fs.fstat方法使用说明

    这篇文章主要介绍了node.js中的fs.fstat方法使用说明,本文介绍了fs.fstat的方法说明、语法、接收参数、使用实例和实现源码,需要的朋友可以参考下
    2014-12-12
  • nodejs基础之buffer缓冲区用法分析

    nodejs基础之buffer缓冲区用法分析

    这篇文章主要介绍了nodejs基础之buffer缓冲区用法,结合实例形式分析了buffer缓冲区的概念、功能、创建、读写等相关操作技巧,需要的朋友可以参考下
    2018-12-12
  • node实现简单的增删改查接口实例代码

    node实现简单的增删改查接口实例代码

    在本篇文章里小编给大家整理的是关于node实现简单的增删改查接口的相关实例内容,有需要的朋友们可以学习下。
    2019-08-08

最新评论