Koa2教程(入门篇)

目录
一、get请求接收的实现
二、原生post请求接收的实现
三、原生路由的实现
四、使用cookie
五、html模板
六、操作静态资源

系列教程
Koa2教程(初识篇)
Koa2教程(常用中间件篇)


一、get请求接收的实现

//ctx、ctx.request都具备相同的query、querystring
//query:返回的是格式化好的参数对象
//querystring:返回的是请求字符串
const Koa = require('koa');
const app = new Koa();
app.use(async(ctx)=>{
    let url =ctx.url;
 
    //从request中获取GET请求
    let request =ctx.request;
    let req_query = request.query;
    let req_querystring = request.querystring;
 
    //从上下文中直接获取
    let ctx_query = ctx.query;
    let ctx_querystring = ctx.querystring;
 
    ctx.body={
        url,
        req_query,
        req_querystring,
        ctx_query,
        ctx_querystring
    }
});
 
app.listen(3000,()=>{
    console.log('[demo] server is starting at port 3000');
});

二、原生post请求接收的实现

1、获取Post请求的步骤:

(1)解析上下文ctx中的原生nodex.js对象req。
(2)将POST表单数据解析成query string-字符串.(例如:user=jspang&age=18)
(3)将字符串转换成JSON格式。

2、ctx.request和ctx.req的区别

(1)ctx.request:是Koa2中context经过封装的请求对象,它用起来更直观和简单。
(2)ctx.req:是context提供的node.js原生HTTP请求对象。这个虽然不那么直观,但是可以得到更多的内容,适合我们深度编程。

3、ctx.method 得到请求类型

Koa2中提供了ctx.method属性,可以轻松的得到请求的类型,然后根据请求类型编写不同的相应方法,这在工作中非常常用。我们先来作个小例子,根据请求类型获得不同的页面内容。GET请求时得到表单填写页面,POST请求时,得到POST处理页面。

4、表单post请求实现
const Koa  = require('koa');
const app = new Koa();
app.use(async(ctx)=>{
    //get获得表单页面
    if(ctx.url==='/' && ctx.method==='GET'){
        let html=`
            

Koa2 request POST

userName


age


`; ctx.body=html; } //post提交表单信息 else if(ctx.url==='/' && ctx.method==='POST'){ let pastData=await parsePostData(ctx); ctx.body=pastData; } else{ ctx.body='

404!

'; } }); //监听ctx.req变化,获取post请求内容 function parsePostData(ctx){ return new Promise((resolve,reject)=>{ try{ let postdata=""; ctx.req.on('data',(data)=>{ postdata += data; }) ctx.req.addListener("end",function(){ let parseData = parseQueryStr( postdata ); resolve(parseData); }) }catch(error){ reject(error); } }); } //解析post请求内容(字符串),转化成对象 function parseQueryStr(queryStr){ let queryData={}; let queryStrList = queryStr.split('&'); for( let [index,queryStr] of queryStrList.entries() ){ let itemList = queryStr.split('='); queryData[itemList[0]] = decodeURIComponent(itemList[1]); } return queryData; } app.listen(3000,()=>{ console.log('[demo] server is starting at port 3000'); });
5、koa-bodyparser实现post请求

三、原生路由的实现

1、在根目录下,新建页面文件夹
pages
├──index.html
├──koa.html
└──404.html
2、基本代码
const Koa = require('koa');
const fs = require('fs');
const app = new Koa();
 
// 根据需求,读取相应的页面,并返回
function render(page){
    return new Promise((resolve, reject)=>{
        let pageUrl = `./pages/${page}`;
        //生成二进制流
        fs.readFile(pageUrl, "binary", (err, data)=>{
            if(err){
                reject(err);
            }else{
                resolve(data);
            }
        })
    })
}

// 识别url,判断所请求的页面
async function route(url){
    let page = '404.html';
    switch(url){
        case '/':
            page ='index.html';
            break;
        case '/index':
            page ='index.html';
            break;
        case '/koa':
            page = 'koa.html';
            break;
        default:
            break; 
    }
    let html = await render(page);
    return html;
}

app.use(async(ctx)=>{
    let url = ctx.request.url;
    let html = await route(url);
    ctx.body=html;
})

app.listen(3000,()=>{
    console.log('[demo] server is starting at port 3000');
});
3、koa-router实现路由

四、使用cookie

1、api

(1)ctx.cookies.get(name,[optins]):读取上下文请求中的cookie。
(2)ctx.cookies.set(name,value,[options]):在上下文中写入cookie。

2、cookie配置对象选项
选项 作用
domain 写入cookie所在的域名
path 写入cookie所在的路径
maxAge Cookie最大有效时长
expires cookie失效时间
httpOnly 是否只用http请求中获得
overwirte 是否允许重写
3、代码实现
const Koa  = require('koa');
const app = new Koa();
 
app.use(async(ctx)=>{
    if(ctx.url=== '/'){
        ctx.cookies.set(
            'name','tony',{
                domain:'127.0.0.1',
                path:'/',
                maxAge:1000*60*60*24,
                expires:new Date('2019-6-18'),
                httpOnly:false,
                overwrite:false
            }
        );
        ctx.body = 'cookie is ok';
    }else{
        if( ctx.cookies.get('MyName')){
            ctx.body = ctx.cookies.get('MyName');
        }else{
            ctx.body = 'Cookie is none';
        }
      
    }
});

app.listen(3000,()=>{
    console.log('[demo] server is starting at port 3000');
});

五、html模板

1、好处

使用html模板,将html从js中分离出去,有助于项目开发和管理。而且,html模板在koa2中,必须通过中间件来实现。

2、koa-views + ejs实现html模板

六、操作静态资源

1、静态资源在开发中的地位

静态资源环境在服务端是十分常用的一种服务,在后台开发中不仅有需要代码处理的业务逻辑请求,也会有很多的静态资源请求。比如请求js,css,jpg,png这些静态资源请求。也非常的多,有些时候还会访问静态资源路径。

2、koa-static实现静态资源操作

你可能感兴趣的:(Koa2教程(入门篇))