Koa中间件(img):
- 中间件的定义
- 中间件的原理
- 中间件如何实现自定义的中间件
koa-generator(img)
- 安装:npm install -g koa-generator
- 创建项目
- koa2 -e koa2-learn
初始化目录:-e表示我的模版引擎使用ejs,如果不加的话,就不是ejs模版引擎,
- cd koa2-learn
- npm install
- npm install --update-binary
- npm start koa2-learn
- localhost:3000
- 注意:
1. 运行的时候利用npm run dev,才能实现改变服务端代码后自启动,例如,在routes中的index.js文件,添加console.log(‘a’),利用npm run dev 才能输出 2. package.json中的scripts里面的内容: dev,prd是--> npm run dev/npm rev prd,, start和test都是 --> npm start/npm test,中间没有run
- koa2 -e koa2-learn
异步(img)
- 异步的概念和场景
- aysnc await 与promise对象的区别
- promise是一直利用then实现异步
- async: 代码视觉上同步,但是还是进行的异步操作,A先执行,然后A执行完B再执行,然后B执行完,C再执行(A,B,C是promise对象)
- 例1:
例2:async ((ctx, next) => { const a = await A; const b = await B; const c = await C; })
router.get('/testA', async (ctx) => { const a = await new Promise((resolve, reject) =>{ global.console.log('start' + new Date().getTime()); setTimeout(()=>{ global.console.log('a' + new Date().getTime()); resolve('abc'); }, 1000) }) ctx.body = { a, } }) //浏览器,输入:localhost:3000/testA -----> 1s后才显示结果abc //而且两次时间差,差不多为1s
- 注意:
aysnc 有await可以没有,但是要是有await,async就必须要有 await 后面是promise对象,如果不是的话,会转化为 promise.resolve(.....)
koa2中间件(img)
- 例如app.js文件中的
const views = require('koa-views') ,const json = require('koa-json')
等都是中间件 - 详细解释:
- koa其实就是一个服务端框架
- 作用:接受来自浏览器的请求,然后经过自己内部的硬转,最后给浏览器一个响应
洋葱每个环状都是中间件,中间件引入肯定是有顺序的,但是use的时候是没有顺序的,
但是如何保证引用的顺序不一样,但是执行的顺序没有差别呢,也就是理解画圈的原因
- 官网:
https://koa.bootcss.com/
- 使用:
- 例1:
koa-pv.js: // 这个函数用来执行app中间处理过程的 function pv(ctx){ //ctx: 进入app中会有一个对象,这个对象会挂载着所有的信息,信息包括两方面,一个是request信息,一个是response信息,所以这个对象是个全局的对象,在整个app中都是能拿到的, //在洋葱图中,最终间是app的处理过程,在处理过程中ctx维持着两方面(request进和response出)的信息,被各个中间件所引用 global.console.log('pv' , ctx.path); // path表示当前页面路径 } // 导出处理过程: // 导出是函数原因:因为app.use()中传进去的参数是一个函数,所以导出是个函数 module.exports = function(){ // 导出异步函数 return async function(ctx, next){ // 下面这两行就是我当前中间件执行完,交给下一中间件处理 pv(ctx) await next()//这个next如果没有,那么它就不会进去洋葱中里面的圈圈,直接返回出去了 } } app.js: const pv = require('./middleware/koa-pv.js'); app.use(pv());
- 例2:
(1)middleware/m1.js: function m1(ctx){ global.console.log('m1' , ctx.path); } module.exports = function(){ return async function(ctx, next){ //进入这个中间件开始 global.console.log('a'); //处理过程 m1(ctx) //交给下一个中间件 await next() //如果没有next的话,输出结果就为a ae,因为没有交个下一个中间件,直接就出去了 //出这个中间件 global.console.log('aE'); } } middleware/m2.js:和m1内容一样,不过函数名不一样 middleware/m3.js:和m1内容一样,不过函数名不一样 (2)app.js引入: const m1 = require('./middleware/m1.js'); const m2 = require('./middleware/m2.js'); const m3 = require('./middleware/m3.js'); app.use(m1()); app.use(m2()); app.use(m3()); (3)npm run dev (4)刷新页面: (5)返回结果: a -> b -> c -> ce -> be -> ae
- 例1:
- 中间件原理:
虽然引入中间件顺序不一样,但是每个中间件都会一进一出 就比如:假如我m1给ctx上面加一个东西,但是怕m2给改掉, 但是其实,执行完2,还是会回到1的,这样就可以保证, 虽然你的顺序比我靠后,但是你处理完还会交给我,保证了平等
- 注意:
- 只要是到达服务器的请求都会执行中间件
- 要是没有await next()这个的话,就会报错,从这个中间件往下的中间件都没法执行
路由(imgs)
- 网站:
https://github.com/ZijianHe/koa-router
-
- 例1:介绍routes下的index.js文件部分代码:
(1)利用koa-router中间件生成一个实例,然后在实例上就会有两个方法(get/post) const router = require('koa-router')() (2)定义路径的名称,路径对应的操作过程 router.get('/', async (ctx, next) => { //ctx.render: 渲染页面 await ctx.render('index', { title: 'Hello Koa 2!' }) }) //请求 /string,返回页面内容为'koa2 string' router.get('/string', async (ctx, next) => { //返回接口的, 字符串类型 ctx.body = 'koa2 string' }) //请求 /json,返回页面内容为'koa2 json' router.get('/json', async (ctx, next) => { //返回接口的, JSON类型 ctx.body = { title: 'koa2 json' } }) (3)导出实例 module.exports = router (4)app.js文件导入模块 const index = require('./routes/index') const users = require('./routes/users') (5)中间件生效 app.use(index.routes(), index.allowedMethods()) app.use(users.routes(), users.allowedMethods())
- 例2:介绍routes下的users.js文件部分代码:
const router = require('koa-router')() //在index.js文件中没有的部分:前缀 //意思为,用这个路由的时候,一定要在前面加上users这个路径 router.prefix('/users') router.get('/', function (ctx, next) { ctx.body = 'this is a users response!' }) 调用: http://localhost:3000/users得到的就是--->this is a users response!
- 例1:介绍routes下的index.js文件部分代码:
cookie和session(imgs)
-
网站:
https://koa.bootcss.com/
-
写cookies
- 用法:
cookie: 名, 值, cookie选项 ctx.cookies.set('name', 'tobi', { signed: true });
- 例1:index.js中进行操作,只要访问首页就种一个cookies
router.get('/', async (ctx, next) => { // 只要访问首页就种一个cookies ctx.cookies.set('pvid' , Math.random()) await ctx.render('index', { title: 'Hello Koa 2!' }) })
- 用法:
-
读cookies用法:
- 例1:访问http://localhost:3000/json,会把cookies的值读出来
router.get('/json', async (ctx, next) => { ctx.body = { title: 'koa2 json', cookie: ctx.cookies.get('pvid') } })
- 例1:访问http://localhost:3000/json,会把cookies的值读出来
-
koa-passport:
https://segmentfault.com/a/1190000011557953