新一代Node.js的Web开发框架Koa

1、.目录1、安装Node环境2、建立项目3、通过koa-generator来建立项目4、目录结构5、app.js 文件分析6、路由管理7、页面渲染8、日志分析1. 安装Node环境让我们从头开始 Koa2 的安装和使用吧，第一步，就是安装Node和NPM环境。在Window上面安装，就直接从官方下载一个可执行安装文件，执行安装即可。在Linux Ubuntu上安装过程也是类似，本机的系统环境为：Linux Ubuntu 16.04 LTS，然后下载Node工程的源文件，编译，安装。* 切换到root用户 sudo -i * 下载nodejs最新版本，源代码 wget https:/nodejs.

2、org/dist/v8.4.0/node-v8.4.0.tar.gz tar xvzf node-v8.4.0.tar.gz cd node-v8.4.0* 编译、安装 ./configure make make install运行node命令和npm命令 node -vv8.4.0 npm -v5.4.12. 建立项目下面我们就开始创建Koa2的项目，接下来的操作在window与linux通用，只是编辑器不同而已。进入window的开发目录，新建项目koa2-demo1。* 进入开发目录 cd d:workspacejs* 新建项目、并进入项目目录 mkdir koa2-demo1 &

3、;& cd koa2-demo1创建一个node项目 d:workspacejskoa2-demo1>npm initThis utility will walk you through creating a package.json file.It only covers the most mon items, and tries to guess sensible defaults.See npm help json for definitive documentation on these fieldsand exactly what they do.Use npm ins

4、tall afterwards to install a package andsave it as a dependency in the package.json file.Press C at any time to quit.package name: (koa2-demo1)version: (1.0.0)description: koa2 demoentry point: (index.js)test mand:git repository:keywords:author: DanZhanglicense: (ISC) MITAbout to write to d:workspac

5、ejskoa2-demo1package.json:"name": "koa2-demo1","version": "1.0.0","description": "koa2 demo","main": "index.js","scripts": "test": "echo "Error: no test specified" && exit 1&quo

6、t;,"author": "DanZhang","license": "MIT"Is this ok" (yes) yes这样我们就完成了一个最简单的nodejs项目，在当前的目录下面生成了package.json的文件。接下来，我们来安装koa2的库，到当前的项目中。 npm install koa -s+ koa2.3.0added 37 packages in 12.462s查看当前目录，发现生成了一个node_modules的目录，这个目录存放了koa包所有的依赖的库。然后，我们新建一个启动文件：

7、index.js，用来启动Koa的项目。 notepad index.jsvar koa = require('koa');var app = new koa();app.use(function *()this.body = 'Hello World');app.listen(3000);启动项目 node index.js打开浏览器:localhost:3000/请点击此处输入图片描述看到这界面，那么恭喜你，第一步成功了。3. 通过koa-generator来建立项目Koa和Express项目一样，都提供了一种脚手架的方式来创建项目，使用这么方式会极大地提高

8、开发的效率，但不建议初学者直接使用，高度自动化的生成器，可能会让你不理解实现的原理。接下来，我们用koa-generator来生成一个koa的项目。安装koa-generator，这是一个命令工具，所以需要全局安装。 npm install -g koa-generator然后，我们创建koa2的项目时，就可以直接使用koa2的命令了。* 进入开发目录 cd d:workspacejs* 生成koa2项目 koa2 koa2-demo2 create : koa2-demo2 create : koa2-demo2/package.json create : koa2-demo2/app.js

9、 create : koa2-demo2/public create : koa2-demo2/public/stylesheets create : koa2-demo2/public/stylesheets/style.css create : koa2-demo2/public/javascripts create : koa2-demo2/public/images create : koa2-demo2/routes create : koa2-demo2/routes/index.js create : koa2-demo2/routes/users.js create : koa

10、2-demo2/views create : koa2-demo2/views/index.pug create : koa2-demo2/views/layout.pug create : koa2-demo2/views/error.pug create : koa2-demo2/bin create : koa2-demo2/bin/ install dependencies: > cd koa2-demo2 && npm install run the app: > SET DEBUG=koa* & npm start koa2-demo2进入项目，

11、并安装依赖库 cd koa2-demo2 && npm install启动项目 npm run start> koa2-demo20.1.0 start d:workspacejskoa2-demo2> node bin/打开浏览器请点击此处输入图片描述如果你看到的界面，和上面的一样，那么恭喜你，用koa-generator生成的koa2的项目，也能正常工作了。这里你可以发现，用koa-generator时，只要一条命令就够了，程序会给你生成很多文件，直接就构建好了一个项目的基础。4. 目录结构接下来，我们就基于koa2-demo2的项目来分析，看一下生成出来的项目

12、目录结构。我们用一个文本编辑器来打开这个项目，这样可以看得更清楚一些。请点击此处输入图片描述bin, 存放启动项目的脚本文件node_modules, 存放所有的项目依赖库。public，静态文件(css,js,img)routes，路由文件(MVC中的C,controller)views，页面文件(pug模板)package.json，项目依赖配置及开发者信息app.js，应用核心配置文件package.json，node项目配置文件package-lock.json，node项目锁定的配置文件5. app.js 文件分析app.js 是应用核心配置文件，我们把这个文件能够看明白，整理koa

13、就非常容易了。app.js文件，我们可以分割为X个部分进行解读：依赖包加载、错误处理、中间件加载、web界面渲染模板、自定义日志、自己定义路由、外部调用接口。/ 依赖包加载const Koa = require('koa')const app = new Koa()const views = require('koa-views')const json = require('koa-json')const onerror = require('koa-onerror')const bodyparser = require('

14、;koa-bodyparser')const logger = require('koa-logger')const index = require('./routes/index')const users = require('./routes/users')/ 错误处理onerror(app)/ 中间件加载app.use(bodyparser(enableTypes:'json', 'form', 'text')app.use(json()app.use(logger()app.use(

15、require('koa-static')(_dirname + '/public')/ web界面渲染模板app.use(views(_dirname + '/views', extension: 'pug')/ 自定义日志app.use(async (ctx, next) => const start = new Date()await next()const ms = new Date() - startconsole.log($ctx.method $ctx.url - $msms)/ 自己定义路由app.use(i

16、ndex.routes(), index.allowedMethods()app.use(users.routes(), users.allowedMethods()/ 外部调用接口module.exports = app麻雀虽小，五脏俱全！通过app.js的配置，就可以把一个web项目给组装起来了。6. 路由管理普通的web应用，通常都是多个页面组成，每个页面会对应一个URL的地址，用户在浏览器输入URL可以打开不同的页面。路由管理，就是把URL和页面的关系对应起来的。在 app.js 中，路由来提取到 ./routes/index.js 和 ./routes/users.js 两个文件中进

17、行实现了。以 ./routes/index.js 文件来举例说明。 notepad ./routes/index.jsconst router = require('koa-router')()/ 解析'/'router.get('/', async (ctx, next) => await ctx.render('index', title: 'Hello Koa 2!')/ 解析 '/string'router.get('/string', async (ctx, next

18、) => ctx.body = 'koa2 string')/ 解析 '/json'router.get('/json', async (ctx, next) => ctx.body = title: 'koa2 json')module.exports = router从代码中分析，当路径为/时，网页会返回Hello Koa 2!；当路径为/string时，网页会返回koa2 string；哪路径是/json时，网页会返回koa2 json。请点击此处输入图片描述7. 页面渲染从上面路由中，我们看到路径/的输出，是一

19、个被渲染为网页输出，而/string和/json的输出是直接字符的输出。传统的web应用，大都是后台渲染的机制。新型的单面应用来说，前后端分离的设计，根本不需要后端来渲染，直接输出json就可以了。对后台渲染的实现，我们可以参考/的实现。router.get('/', async (ctx, next) => await ctx.render('index', title: 'Hello Koa 2!')上面代码中，通过 await ctx.render(index,) 这样的语法，就可以加载pug的模板引擎。await是ES6的关键字，用于把异步代码同步化，就不再写回调函数了(callback)。ctx.render()函数，用于加载渲染引擎。然后，我们找到views中的index.pug文件。 notepad ./views/index.pugextends layoutblock conte