资讯专栏INFORMATION COLUMN

express web的一款mvc框架

_ang / 3018人阅读

摘要:相关的网站开发有这么常用的四款数据层视图层控制层框架,我们今天说一下阿里的框架是一个自身功能极简,完全是由路由和中间件构成一个的开发框架安装创建一个目录通过命令为你的应用创建一个文件。修改请求和响应对象。注意只对使用或加载的中间件有效。

express

express相关的网站
*http://expressjs.com/
*http://www.expressjs.com.cn/
*https://github.com/pugjs/pug
*https://pug.bootcss.com/api/g...

web开发有这么常用的四款mvc (model(数据层) view(视图层) controller(控制层))框架,我们今天说一下express

*express
*koa
*阿里的egg框架
*thinkjs

express()

Express 是一个自身功能极简,完全是由路由和中间件构成一个的 web 开发框架

安装

创建一个目录

$ mkdir myapp
$ cd myapp  

通过 npm init 命令为你的应用创建一个 package.json 文件。

$ npm init  

然后需要我们自己在目录下创建一个app.js 文件
接下来安装 Express 并将其保存到依赖列表中:

$ npm install express --save  
Hello world 实例 app.js
var express = require("express");//引入模块
var app = express();//调用函数

app.get("/", function (req, res) {
  res.send("Hello World!");
});//请求Hello World!

var server = app.listen(3000, function () {
  var host = server.address().address;
  var port = server.address().port;

  console.log("Example app listening at http://%s:%s", host, port);
});  //启动

运行下面命令

$ node app.js  

然后在浏览器中打开 http://localhost:3000/ 并查看输出结果。

express 应用生成器

通过应用生成器工具 express 可以快速创建一个应用的脚手架。
命令行安装

$ npm install express-generator -g  

在当前工作目录下创建一个命名为 myapp1 的应用。(和myapp同级)

$ express myapp  

安装依赖包:

$ cd myapp 
$ npm install  

启动这个应用(MacOS 或 Linux 平台):

$ DEBUG=myapp npm start  

Windows 平台使用如下命令:

set DEBUG=myapp & npm start  

然后在浏览器中打开 http://localhost:3000/ 网址就可以看到这个应用了

express路由

路由是指如何定义应用的端点(URIs)以及如何响应客户端的请求

我们可以在routes这个文件夹下创建一个文件order.js来详细的说一下路由的用法。
order.js

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

router.get("/", function(req, res, next) {
  res.render("order",{msg:"我的订单"});
});
router.get("/list", function(req, res, next) {
  res.send("订单列表");
});


module.exports = router;

app.js

var order = require("./routes/order");//引入roder.js
app.use("/order", order);
Express 模板引擎(本博客开头有网址关于 pug(jade)的)

模板引擎有这么几类pug(jade) ejs handlerbars(扩展模块)
需要在应用中进行如下设置才能让 Express 渲染模板文件:
*views, 放模板文件的目录,比如: app.set("views", "./views")
*view engine, 模板引擎,比如: app.set("view engine", "jade")

然后安装相应的模板引擎 npm 软件包。

$ npm install jade --save
$ npm install ejs --save

需要那种就在app.set("view engine", "jade")里将"jade"改成那种。
在 views 目录下生成名为 order.jade 的 Jade 模板文件,内容如下:

doctype html
html
  head
    title 订单
  body
    h1 #{msg}

然后使用路由渲染它:

router.get("/",function(req,res,nest){
    res.render("orders",{msg:"订单首页"})
})
Express 托管静态文件

通过 Express 内置的 express.static 可以方便地托管静态文件,例如图片、CSS、JavaScript 文件等。

将静态资源文件所在的目录作为参数传递给 express.static 中间件就可以提供静态资源文件的访问了。例如,假设在 public 目录放置了图片、CSS 和 JavaScript 文件,你就可以:

app.use(express.static("public"));

如果你的静态资源存放在多个目录下面,你可以多次调用 express.static 中间件:

app.use(express.static("public"));
app.use(express.static("files"));

你就可以通过带有 “/static” 前缀的地址来访问 public 目录下面的文件了。

http://localhost:3000/static/images/kitten.jpg
http://localhost:3000/static/css/style.css
http://localhost:3000/static/js/app.js
http://localhost:3000/static/images/bg.png
http://localhost:3000/static/hello.html
中间件

中间件(Middleware) 是一个函数,它可以访问请求对象(request object (req)), 响应对象(response object (res)), 和 web 应用中处于请求-响应循环流程中的中间件,一般被命名为 next 的变量。

中间件的功能包括:

*执行任何代码。
*修改请求和响应对象。
*终结请求-响应循环。
*调

中间件种类:

*应用级中间件
*路由级中间件
*错误处理中间件
*内置中间件
*第三方中间件

应用级中间件

应用级中间件绑定到 app 对象 使用 app.use() 和 app.METHOD(), 其中, METHOD 是需要处理的 HTTP 请求的方法,例如 GET, PUT, POST 等等,全部小写。例如:

var app = express();

// 没有挂载路径的中间件,应用的每个请求都会执行该中间件
app.use(function (req, res, next) {
  console.log("Time:", Date.now());
  next();
});

// 挂载至 /user/:id 的中间件,任何指向 /user/:id 的请求都会执行它
app.use("/user/:id", function (req, res, next) {
  console.log("Request Type:", req.method);
  next();
});

// 路由和句柄函数(中间件系统),处理指向 /user/:id 的 GET 请求
app.get("/user/:id", function (req, res, next) {
  res.send("USER");
});

在下面的例子中,为指向 /user/:id 的 GET 请求定义了两个路由。第二个路由虽然不会带来任何问题,但却永远不会被调用,因为第一个路由已经终止了请求-响应循环

// 一个中间件栈,处理指向 /user/:id 的 GET 请求
app.get("/user/:id", function (req, res, next) {
  console.log("ID:", req.params.id);
  next();
}, function (req, res, next) {
  res.send("User Info");
});

// 处理 /user/:id, 打印出用户 id
app.get("/user/:id", function (req, res, next) {
  res.end(req.params.id);
});

如果需要在中间件栈中跳过剩余中间件,调用 next("route") 方法将控制权交给下一个路由。 注意: next("route") 只对使用 app.VERB() 或 router.VERB() 加载的中间件有效。

路由级中间件

路由级中间件和应用级中间件一样,只是它绑定的对象为 express.Router()。

var router = express.Router();

路由级使用 router.use() 或 router.VERB() 加载。

var app = express();
var router = express.Router();

// 没有挂载路径的中间件,通过该路由的每个请求都会执行该中间件
router.use(function (req, res, next) {
  console.log("Time:", Date.now());
  next();
});

// 一个中间件栈,显示任何指向 /user/:id 的 HTTP 请求的信息
router.use("/user/:id", function(req, res, next) {
  console.log("Request URL:", req.originalUrl);
  next();
}, function (req, res, next) {
  console.log("Request Type:", req.method);
  next();
});

// 一个中间件栈,处理指向 /user/:id 的 GET 请求
router.get("/user/:id", function (req, res, next) {
  // 如果 user id 为 0, 跳到下一个路由
  if (req.params.id == 0) next("route");
  // 负责将控制权交给栈中下一个中间件
  else next(); //
}, function (req, res, next) {
  // 渲染常规页面
  res.render("regular");
});

// 处理 /user/:id, 渲染一个特殊页面
router.get("/user/:id", function (req, res, next) {
  console.log(req.params.id);
  res.render("special");
});

// 将路由挂载至应用
app.use("/", router);
错误处理中间件

错误处理中间件和其他中间件定义类似,只是要使用 4 个参数,而不是 3 个,其签名如下: (err, req, res, next)。

app.use(function(err, req, res, next) {
  console.error(err.stack);
  res.status(500).send("Something broke!");
});
内置中间件

express.static(root, [options])

express.static 是 Express 唯一内置的中间件。它基于 serve-static,负责在 Express 应用中提托管静态资源。

参数 root 指提供静态资源的根目录。
下面的例子使用了 express.static 中间件,其中的 options 对象经过了精心的设计。

var options = {
  dotfiles: "ignore",
  etag: false,
  extensions: ["htm", "html"],
  index: false,
  maxAge: "1d",
  redirect: false,
  setHeaders: function (res, path, stat) {
    res.set("x-timestamp", Date.now());
  }
}

app.use(express.static("public", options));
第三方中间件

通过使用第三方中间件从而为 Express 应用增加更多功能。

安装所需功能的 node 模块,并在应用中加载,可以在应用级加载,也可以在路由级加载。

进程管理器

在编写程序时,我们发现,每次更改文件之后,都需要在命令行内停止当前的服务,然后输入 npm start ,很麻烦。我们需要一款自动刷新的工具

pm2

安装:

npm install pm2 -gd

启动

pm2 start ./bin/www --watch
PS D:
ode.jscode505myapp2> pm2 start ./bin/www --watch
┌──────────┬────┬──────┬───────┬────────┬─────────┬────────┬─────┬───────────┬────────┬──────────┐
│ App name │ id │ mode │ pid   │ status │ restart │ uptime │ cpu │ mem       │ user   │ watching │
├──────────┼────┼──────┼───────┼────────┼─────────┼────────┼─────┼───────────┼────────┼──────────┤
│ www      │ 0  │ fork │ 17480 │ online │ 0       │ 0s     │ 0%  │ 24.1 MB   │ lenovo │ enabled  │
└──────────┴────┴──────┴───────┴────────┴─────────┴────────┴─────┴───────────┴────────┴──────────┘
 Use `pm2 show ` to get more details about an app

当显示 status 为 online 时,说明程序启动成功

现在可以打开 http://localhost:3000 就可以看到运行的程序了

停止应用:

pm2 stop 0

重启

pm2 restart 0

显示程序信息

pm2 show 0

删除程序

pm2 delete 0

查看程序列表

pm2 list

这就是一些express的基本内容,喜欢的点个赞再走呗。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/89222.html

相关文章

  • Web框架的常用架构模式(JavaScript语言)

    摘要:只能在不同的时候选用不同的假设和不同的理论来解释问题,许来西的文章讲到科学一定程度上通过放弃一贯性换取了实用性,放弃自洽性换取了它洽性。然而遗憾的是本身只提供了模块和洋葱模型的最小封装。 在写干货之前,我想先探(qiang)讨(diao)两个问题,模式的局限性?模式有什么用? 最近看到一篇文章对我启发很大,许来西在知乎的回答《哲学和科学有什么关联?》,全篇较长,这里摘录我要引出的一点:...

    loostudy 评论0 收藏0
  • MEAN.js 文档

    摘要:感谢使用框架本文档涵盖构建应用所需的基础知识。用于数据校验的组件及相关文件在此目录进行管理。除了自定义中间件外,还是用了诸多第三方的中间件,它们是五测试我们使用组件对服务端代码进行测试。识别当前导航从已有导航中删除给定标识的导航配置。 本文同步至个人博客 MEAN.js 文档,转载请注明出处。 Overview 感谢使用 MEAN.js 框架! 本文档涵盖构建 MEAN 应用所需的基础...

    Hydrogen 评论0 收藏0
  • 你不可不知道的20个优秀PHP框架

    摘要:每一个开发者都知道,拥有一个强大的框架可以让开发工作变得更加快捷安全和有效。官方网站是一款老牌的框架,现在稳定版本已经是了。官方网站是由最大的社区之一的管理开发的,也是一个开源的框架。 对于Web开发者来说,PHP是一款非常强大而又受欢迎的编程语言。世界上很多顶级的网站都是基于PHP开发的。 每一个开发者都知道,拥有一个强大的框架可以让开发工作变得更加快捷、安全和有效。在开发项目之前选...

    zombieda 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<