koa 学习笔记





一,初始化koa
1, npm init -y //初始化项目
2,npm install -g cnpm –registry=https://registry.npm.taobao.org //切换镜像
3, cnpm install koa –save //安装koa
4, 编写基本代码
const koa=require(‘koa’);
const app = new koa();
app.use(async(cxt)=>{
cxt.body=‘我运行成功了’
})
app.listen(3000,()=>{
console.log(‘我在3000端口运行’)
})
5,跑成功了
二, 准备es6语法,我这里就不写了
三,在写一遍scync 和 awite 和 Promise
function testAwait(){
console.log(“testAwait”);
}
async function helloAsync(){
await testAwait(); //等待上面函数解决结果
console.log(“helloAsync”);
}

四,路由
1, cnpm install koa-router –save 安装路由

2,路由使用	
	const Koa = require('koa');
	const Router = require('koa-router');//引入路由
	const app = new Koa();
	const router = new Router();
	router.get('/',async (ctx)=>{
		ctx.body='111';
	}).post('/',async (ctx)=>{
		ctx.body='222';
	})
	app.use(router.routes()).use(router.allowedMethods());//使用路由,1,这个在最后调用,2,allowedMethods应该是拦截的意思,说明最后根据情况设置相应头,建议添加
	app.listen(3000,()=>{
		console.log('我在3000端口运行')
	})
3,get 传值 实例
	const Koa = require('koa');
	const router = require('koa-router')();//引入路由
	const app = new Koa();
	router.get('/',async (ctx)=>{
		console.log(ctx.request) //原生请求
		console.log(ctx.query) //这个是返回对象
		console.log(ctx.querystring) //这个是返回字符串
		console.log(ctx.url)//获取get url 地址
		ctx.body='111';
	})
	app.use(router.routes()).use(router.allowedMethods());//使用路由,1,这个在最后调用,2,allowedMethods应该是拦截的意思,说明最后根据情况设置相应头,建议添加
	app.listen(3000,()=>{
		console.log('我在3000端口运行')
	})
4,动态路由
	const Koa = require('koa');
	const router = require('koa-router')();//引入路由
	const app = new Koa();
	router.get('/index',async (ctx)=>{ 
		console.log(ctx.params) //获取动态路由,这里注意,可以传入多个动态路由,还需要注意,如果定义了就一定要传入,这里需要在研究游戏,动态路由
		ctx.body='121'; 
	})
	router.get('/index/:id',async (ctx)=>{ 
		console.log(ctx.params) //获取动态路由,这里注意,可以传入多个动态路由,还需要注意,如果定义了就一定要传入
		ctx.body='111'; 
	})
	app.use(router.routes()).use(router.allowedMethods());//使用路由,1,这个在最后调用,2,allowedMethods应该是拦截的意思,说明最后根据情况设置相应头,建议添加
	app.listen(3000,()=>{
		console.log('我在3000端口运行')
	})

五,中间件
围绕路由的操作,包括,在匹配路由之前,做某件事,匹配路由之后做某件事,可以理解 生命周期,钩子函数,代理等等

应用级中间件//在主程序调用,两个参数,一个是,对应路由,二个是对应的操作
	app.use('/',async(cxt,next)=>{
		ctx.body='777'
		await next() //代表往下执行,就卡住这里了
	})
路由级中间件
	在路由内使用的中间件//执行完可以继续向下匹配
	router.get('/index',async (ctx,next)=>{ 
		console.log(11221);
		await next()
	})
	router.get('/index',async (ctx)=>{ 
		console.log(11222221);
	})
错误中间件
	这里主要是执行顺序,最后执行的才是404
	这里需要理解 洋葱头 执行顺序
		先执行 next 之前的,然后等待 next 执行完, 在执行next 之后的
		const Koa = require('koa');
		const router = require('koa-router')();//引入路由
		const app = new Koa();
		app.use(async(ctx,next)=>{
			console.log(111);
			await next()
			if(ctx.status==404){
				ctx.status = 404;
				ctx.body="这是一个 404 页面"
			}
		})
		router.get('/index',async (ctx,next)=>{ 
			console.log(11221);
			await next()
		})
		router.get('/index',async (ctx)=>{ 
			console.log(11222221);
			ctx.body='1111'
		})
		app.use(router.routes()).use(router.allowedMethods());//使用路由,1,这个在最后调用,2,allowedMethods应该是拦截的意思,说明最后根据情况设置相应头,建议添加
		app.listen(3000,()=>{
			console.log('我在3000端口运行')
		})

六,模版 引擎
1,安装 cnpm install –save koa-views //安装视图
2,安装 cnpm install ejs –save 模版引擎
3,引入 var views = require(‘koa-views’); //views引入
4,使用 视图中间件 ,并把 引擎设置为ejs,第一个代表是 模版的位置,第二个是参数
app.use(views(__dirname + ‘/views’, { //这个是带参数的,默认后缀是html
map: {
html: ‘ejs’
}
}));
或者
app.use(views(__dirname, { extension: ‘ejs’ })) //这个应该是简写
5,使用引擎,渲染数据 //基本跑起来了
const Koa = require(‘koa’);
const Router = require(‘koa-router’); //引入路由
const views = require(‘koa-views’); //引入视图
const app = new Koa();
const router = new Router();
router.get(’/’, async (ctx) => {
let title = ‘hello koa2’ ; //设置变量
await ctx.render(‘index’,{ //输出index 模版,并设置数据title //主要,一定要await 这里是异步操作
title
})
})
app.use(views(__dirname+’/view’, { extension: ‘ejs’ }))
app.use(router.routes()).use(router.allowedMethods()); //使用路由,1,这个在最后调用,2,allowedMethods应该是拦截的意思,说明最后根据情况设置相应头,建议添加
app.listen(3000, () => {
console.log(‘我在3000端口运行’)
})
6,ejs基本使用方法
<%=h%> 绑定数据
<%for(var i=0;i //循环输出数据

  • <%=list[i] %>
  • <%}%>

    <% if(true){ %> //条件判断

    true

    <%} else{ %>

    false

    <%} %>

    <%- include header.ejs %> 引入数据

    <%-h%> //引入 html 用来解析html 用= 会把数据原样输出,不替换html

    7,对所有添加一个公共变量

    //写一个中间件配置公共的信息 //这个是模版引擎的用法

    app.use(async (ctx,next)=>{

    ctx.state.userinfo=‘张三’;

    await next();/
    继续向下匹配路由/

    })

    七,post 提交数据

    1,原生方法 //下面是原生使用,记住,await 等待的是 promise 数据 //这里要学习

    function parsePostData(ctx){

    return new Promise((resolve,reject)=>{

    try{

    let postdata=””;

    ctx.req.on(‘data’,(data)=>{

    postdata += data

    })

    ctx.req.on(“end”,function(){

    resolve(postdata);

    })

    }catch(error){

    reject(error);

    }

    });

    }

    2,使用中间件,koa-bodyparser

    1),安装 cnpm install koa-bodyparser –save

    2),引入 const bodyParser = require(‘koa-bodyparser’)

    3),使用 app.use(bodyParser());

    const Koa = require(‘koa’);

    const Router = require(‘koa-router’); //引入路由

    const views = require(‘koa-views’); //引入视图

    const bodyParser = require(‘koa-bodyparser’); //引入post 引擎

    const app = new Koa();

    const router = new Router();

    router.get(’/’, async (ctx) => {

    await ctx.render(‘index’)

    })

    router.post(’/’,async (ctx)=>{

    ctx.body=ctx.request.body; //这样使用

    })

    app.use(bodyParser());

    app.use(views(__dirname+’/view’, { extension: ‘ejs’ }))

    app.use(router.routes()).use(router.allowedMethods()); //使用路由,1,这个在最后调用,2,allowedMethods应该是拦截的意思,说明最后根据情况设置相应头,建议添加

    app.listen(3000, () => {

    console.log(‘我在3000端口运行’)

    })

    八,静态资源

    1,安装 cnpm install koa-static –save

    2,引入 const serve = require(‘koa-static’);

    3,使用 app.use(serve(‘test/fixtures’)); 或者 app.use(serve(__dirname + ‘/test/fixtures’));

    //这里需要注意的是中间件可以配置多个,配置多个目录是静态文件

    const Koa = require(‘koa’);

    const Router = require(‘koa-router’); //引入路由

    const views = require(‘koa-views’); //引入视图

    const bodyParser = require(‘koa-bodyparser’); //引入post 引擎

    const serve = require(‘koa-static’); //引入静态资源

    const app = new Koa();

    const router = new Router();

    router.get(’/’, async (ctx) => {

    await ctx.render(‘index’)

    })

    app.use(serve(‘static’));

    app.use(bodyParser());

    app.use(views(__dirname+’/view’, { extension: ‘ejs’ }))

    app.use(router.routes()).use(router.allowedMethods());

    app.listen(3000, () => {

    console.log(‘我在3000端口运行’)

    })

    九,art-template 另一个模版,腾讯公司出品

    1,安装 cnpm install art-template –save

    cnpm install koa-art-template –save

    2,引入 const render = require(‘koa-art-template’);

    3,render(app, {

    root: path.join(__dirname, ‘view’), //模版地址//这里使用了,path 了

    extname: ‘.html’, //后缀名称

    debug: process.env.NODE_ENV !== ‘production’ //是否开启调试模式//直接用真假就行

    });

    4, 可以参考官方文档

    const Koa = require(‘koa’);

    const Router = require(‘koa-router’); //引入路由

    const bodyParser = require(‘koa-bodyparser’); //引入post 引擎

    const serve = require(‘koa-static’); //引入静态资源

    const render = require(‘koa-art-template’); //腾讯高效模版引擎

    const path = require(‘path’); //这个是内置path 模块

    const app = new Koa();

    const router = new Router();

    router.get(’/’, async (ctx) => {

    await ctx.render(‘index’)

    })

    //配置模版引擎

    render(app, {

    root: path.join(__dirname, ‘view’), //模版地址//这里使用了,path 了

    extname: ‘.html’, //后缀名称

    debug: process.env.NODE_ENV !== ‘production’ //是否开启调试模式//直接用真假就行

    });

    app.use(serve(‘static’));

    app.use(bodyParser());

    app.use(router.routes()).use(router.allowedMethods());

    app.listen(3000, () => {

    console.log(‘我在3000端口运行’)

    })

    5,语法,非常好,复制文档就行


    文档

    十,cookie

    1,这个内置功能,直接用ctx

    const Koa = require(‘koa’);

    const Router = require(‘koa-router’); //引入路由

    const app = new Koa();

    const router = new Router();

    router.get(’/’, async (ctx) => {

    ctx.cookies.set( ‘cid’, ‘ddddd’, //可替换为token

    { domain: ‘localhost’, // 写cookie所在的域名

    path: ‘/’, // 写cookie所在的路径

    maxAge: 10 * 60 * 1000, // cookie有效时长

    //expires: new Date(‘2017-02-15’), // cookie失效时间

    httpOnly: false, // 是否只用于http请求中获取

    overwrite: false ,// 是否允许重写

    })

    	}).get('/index',async (ctx)=>{
    		console.log(ctx.cookies.get('cid'));
    	})
    	app.use(router.routes()).use(router.allowedMethods()); 
    	app.listen(3000, () => {
    		console.log('我在3000端口运行')
    	})
    2,不能设置中文
    	使用base64
    	console.log(new Buffer('hello, world!').toString('base64'));// 转换成 base64 字符
    	console.log(new Buffer('aGVsbG8sIHdvcmxkIQ==', 'base64').toString());// 还原 base64 
    		const Koa = require('koa');
    		const Router = require('koa-router'); //引入路由
    		const app = new Koa();
    		const router = new Router();
    		router.get('/', async (ctx) => {
    			let wo=new Buffer('水电费').toString('base64');
    			 ctx.cookies.set( 'cid', wo)
    		}).get('/index',async (ctx)=>{
    			let wo=ctx.cookies.get('cid');
    			console.log(new Buffer(wo, 'base64').toString());
    		})
    		app.use(router.routes()).use(router.allowedMethods()); 
    		app.listen(3000, () => {
    			console.log('我在3000端口运行')
    		})
    

    十一, Session
    1,安装 cnpm install koa-session –save
    2,引入 const session = require(‘koa-session’);
    3,配置
    app.keys = [‘some secret hurr’]; //这个是签名,默认
    const CONFIG = {
    key: ‘koa:sess’, //这个是签名,默认
    maxAge: 86400000, //过期时间
    autoCommit: true, //自动设置头,默认
    overwrite: true, //是否覆盖,默认
    httpOnly: true, //是否只有服务器端访问
    signed: true, //签名,默认
    rolling: false, //每次是否刷新session
    renew: false, //快过期时候刷新session,应该开启
    };
    app.use(session(CONFIG, app));
    4,使用
    设置值 ctx.session.username = “张三”;
    获取值 ctx.session.username
    const Koa = require(‘koa’);
    const router = require(‘koa-router’)(); //引入路由
    const session = require(‘koa-session’);
    const app = new Koa();
    router.get(’/’, async (ctx) => {
    ctx.session.username = “张三”;
    }).get(’/index’,async (ctx)=>{
    console.log(ctx.session.username)
    })
    app.keys = [‘some secret hurr’]; //这个是签名,默认
    const CONFIG = {
    key: ‘koa:sess’, //这个是签名,默认
    maxAge: 86400000, //过期时间
    autoCommit: true, //自动设置头,默认
    overwrite: true, //是否覆盖,默认
    httpOnly: true, //是否只有服务器端访问
    signed: true, //签名,默认
    rolling: false, //每次是否刷新session
    renew: true, //快过期时候刷新session,应该开启
    };
    app.use(session(CONFIG, app));
    app.use(router.routes()).use(router.allowedMethods());
    app.listen(3000, () => {
    console.log(‘我在3000端口运行’)
    })
    十二, js 类和继承
    十三, 有关数据库的封装,这里先不封装了,过一段时间再说。
    十四,路由的模块
    1,先了解官方的模块安装(官方项目生成器)
    1、全局安装 cnpm install koa-generator -g
    2、创建项目 koa koa_demo
    3、安装依赖 cd koa_demo
    npm install
    4、启动项目 npm start
    2,大模块处理
    1,首先新建文件,设置路由文件 //下面是新建文件内容,举例,下面是index.js
    const Router = require(‘koa-router’); //引入路由
    let router = new Router(); //实例化路由
    router.get(’/’,async(ctx)=>{ //这里定义了三个路由
    ctx.body=“这是前台首页”;
    })
    router.get(’/news’,async(ctx)=>{
    ctx.body =‘这是前台新闻页面’;
    })
    router.get(’/user’,async(ctx)=>{
    ctx.body =‘这是用户页面’;
    })
    module.exports=router; //这里是暴露路由,也可以在这里实例化
    2,在主文件引入,并使用 这里是可以多级引入的,就是在子文件夹,在建文件夹,在引入文件
    const Koa = require(‘koa’);
    const app = new Koa();
    const Router = require(‘koa-router’);
    let index=require(’./module/index.js’);
    //装载所有子路由
    let router = new Router();
    router.use(’/index,index.routes());
    //加载路由中间件 下面也不能省
    app.use(router.routes());
    app.use(router.allowedMethods());
    app.listen(3000,()=>{
    console.log(’[demo] server is starting at port 3000’);
    });
    3,模版的模块处理
    前台模版,直接使用就行,
    router.get(’/’, async (ctx) => {
    await ctx.render(‘index/index’)
    })

    发布了59 篇原创文章 ·
    获赞 3 ·
    访问量 1万+