koa

作者: 新世界的冒险 | 来源:发表于2021-10-08 14:36 被阅读0次

1.安装

npm i koa

2.简单使用

const Koa = require('koa')
const app = new Koa()

app.use( async ( ctx ) => {
  ctx.body = 'hello koa2'
})

app.listen(3000)

3.koa的脚手架

npm i -g koa-generator

3.1 创建koa2项目

koa2 xxx(文件名)


image.png

3.2 四种启动方式

image.png

1.npm start
该启动命令也是我们创建项目后使用的启动命令。
注意:该命令启动的项目,更改服务端接口后服务不会自启动。
2.npm run dev
该启动命令启动项目后,更改服务端接口后服务会自启动。
npm run dev启动项目后用的是nodemon,是监听。

4.koa2中间件

通俗的讲:中间件就是匹配路由之前或者匹配路由完成做的一系列的操作,我们就可以把它叫做中间件。
在express中间件(Middleware) 是一个函数,它可以访问请求对象(request object (req)), 响应对象(response object (res)), 和 web 应用中处理请求-响应循环流程中的中间件,一般被命名为 next 的变量。在Koa中中间件和express有点类似。

中间件的功能包括:
执行任何代码。
修改请求和响应对象。
终结请求-响应循环。
调用堆栈中的下一个中间件。

如果我的get、post回调函数中,没有next参数,那么就匹配上第一个路由,就不会往下匹配了。如果想往下匹配的话,那么需要写next()

4.1 应用级中间件

const Koa = require('koa');
const Router = require('koa-router');

const app = new Koa();
const router = new Router();
app.use(async (ctx,next)=>{
    console.log(new Date());
    await next();
})
router.get('/', function (ctx, next) {
    ctx.body="Hello koa";
})
router.get('/news',(ctx,next)=>{
    ctx.body="新闻页面"
});
app.use(router.routes()); //作用:启动路由
app.use(router.allowedMethods()); //作用: 当请求出错时的处理逻辑
app.listen(3000,()=>{
    console.log('starting at port 3000');
});

4.2 路由中间件

router.get('/', async(ctx, next)=>{
    console.log(1)
    next()
})
router.get('/', function (ctx) {
    ctx.body="Hello koa";
})

4.3 错误处理中间件

app.use(async (ctx,next)=> {
    next();
    if(ctx.status==404){
    ctx.status = 404;
    ctx.body="这是一个404页面"
  }
});

4.4 第三方中间件

const static = require('koa-static'); 
    const staticPath = './static'; 
    app.use(static(
    path.join( __dirname, staticPath)
)) 



const bodyParser = require('koa-bodyparser');
app.use(bodyParser());

5.koa路由

路由(Routing)是由一个 URI(或者叫路径)和一个特定的 HTTP 方法(GET、POST 等)组成的,涉及到应用如何响应客户端对某个网站节点的访问。

通俗的讲:路由就是根据不同的URL地址,加载不同的页面实现不同的功能。

Koa中的路由和Express有所不同,在Express中直接引入Express就可以配置路由,但是在Koa中我们需要安装对应的koa-router路由模块来实现。
安装: npm install --save koa-router

const Koa = require('koa');
const router = require('koa-router')();  //注意:引入的方式
const app = new Koa();
router.get('/', function (ctx, next) {
  ctx.body="Hello koa";
})

router.get('/news,(ctx,next)=>{
  ctx.body="新闻page"
});

app.use(router.routes()); //作用:启动路由
app.use(router.allowedMethods()); // 作用: 这是官方文档的推荐用法,我们可以看到router.allowedMethods()用在了路由匹配router.routes()之后,所以在当所有路由中间件最后调用.此时根据ctx.status设置response响应头
app.listen(3000,()=>{
  console.log('starting at port 3000');
});

5.1 GET请求获取数据

在ko2a中,获取GET请求数据源头是koa中request对象中的query方法或querystring方法,query返回是格式化好的参数对象,querystring返回的是请求字符串,由于ctx对request的API有直接引用的方式,所以获取GET请求数据有两个途径。

1.是从上下文中直接获取
请求对象ctx.query,返回如 { a:1, b:2 }
请求字符串 ctx.querystring,返回如 a=1&b=2

2.是从上下文的request对象中获取
请求对象ctx.request.query,返回如 { a:1, b:2 }
请求字符串 ctx.request.querystring,返回如 a=1&b=2

5.2 POST请求获取数据

对于POST请求的处理,koa2没有封装获取参数的方法,需要通过解析上下文context中的原生node.js请求对象req,将POST表单数据解析成query string(例如:a=1&b=2&c=3),再将query string 解析成JSON格式(例如:{"a":"1", "b":"2", "c":"3"})

注意:ctx.request是context经过封装的请求对象,ctx.req是context提供的node.js原生HTTP请求对象,同理ctx.response是context经过封装的响应对象,ctx.res是context提供的node.js原生HTTP请求对象。

5.3 koa-bodyparser模块

安装:npm install --save koa-bodyparser
通过ctx.request.body获取post提交的数据

var Koa = require('koa');
var bodyParser = require('koa-bodyparser');
var app = new Koa();
app.use(bodyParser());
 
app.use(async ctx => { 
  ctx.body = ctx.request.body;
});

6.koa-static静态资源中间件

一个http请求访问web服务静态资源,一般响应结果有三种情况

访问文本,例如js,css,png,jpg,gif
访问静态目录
找不到资源,抛出404错误
koa-static主要是用于访问静态资源
安装:npm install --save koa-static

const static = require('koa-static'); 

app.use(static(
    path.join( __dirname,  'public')
)) 

这个时候静态资源就可以被koa中间件解析了

7.Koa2中 Cookie的使用

-cookie 是存储于访问者的计算机中的变量。可以让我们用同一个浏览器访问同一个域名的时候共享数据。
-HTTP是无状态协议。简单地说,当你浏览了一个页面,然后转到同一个网站的另一个页面,服务器无法认识到这是同一个浏览器在访问同一个网站。每一次的访问,都是没有任何关系的。
-Cookie是一个简单到爆的想法:当访问一个页面的时候,服务器在下行HTTP报文中,命令浏览器存储一个字符串; 浏览器再访问同一个域的时候,将把这个字符串携带到上行HTTP请求中。第一次访问一个服务器,不可能携带cookie。 必须是服务器得到这次请求,在下行响应报头中,携带cookie信息,此后每一次浏览器往这个服务器发出的请求,都会携带这个cookie。

7.1 Koa中设置Cookie的值

ctx.cookies.set(name, value, [options])

通过 options 设置 cookie name 的 value :
options 名称 options 值

maxAge              一个数字表示从 Date.now() 得到的毫秒数
expires cookie      过期的 Date
path cookie         路径, 默认是'/'
domain cookie       域名
secure             安全 cookie   默认false,设置成true表示只有 https可以访问
httpOnly           是否只是服务器可访问 cookie, 默认是 true
overwrite          一个布尔值,表示是否覆盖以前设置的同名的 cookie (默认是 false). 如果是 true, 在同一个请求中设置相同名称的所有 Cookie(不管路径或域)是否在设置此Cookie 时从 Set-Cookie 标头中过滤掉。

7.2 Koa中获取Cookie的值

ctx.cookies.get('name');

7.3 Koa中设置中文Cookie

console.log(new Buffer('hello, world!').toString('base64'));// 转换成base64字符串:aGVsbG8sIHdvcmxkIQ==
console.log(new Buffer('aGVsbG8sIHdvcmxkIQ==', 'base64').toString());// 还原base64字符串:hello, world!

8.Koa2中Session

session是另一种记录客户状态的机制,不同的是Cookie保存在客户端浏览器中,而session保存在服务器上。
当浏览器访问服务器并发送第一次请求时,服务器端会创建一个session对象,生成一个类似于key,value的键值对, 然后将key(cookie)返回到浏览器(客户)端,浏览器下次再访问时,携带key(cookie),找到对应的session(value)。 客户的信息都保存在session中

8.1 koa-session的使用

安装:npm install koa-session --save

8.2 引入koa-session

const session = require('koa-session');

8.3 设置官方文档提供的中间件

app.keys = ['some secret hurr'];
const CONFIG = {
   key: 'koa:sess',   //cookie key (default is koa:sess)
   maxAge: 86400000,  // cookie的过期时间 maxAge in ms (default is 1 days)
   overwrite: true,  //是否可以overwrite    (默认default true)
   httpOnly: true, //cookie是否只有服务器端可以访问 httpOnly or not (default true)
   signed: true,   //签名默认true
   rolling: false,  //在每次请求时强行设置cookie,这将重置cookie过期时间(默认:false)
   renew: false,  //(boolean) renew session when session is nearly expired,
};
app.use(session(CONFIG, app));

8.4 使用

设置值 ctx.session.username = "张三";
获取值 ctx.session.username

9.Koa中Cookie和Session区别

1、cookie数据存放在客户的浏览器上,session数据放在服务器上。
2、cookie不是很安全,别人可以分析存放在本地的COOKIE并进行COOKIE欺骗
考虑到安全应当使用session。
3、session会在一定时间内保存在服务器上。当访问增多,会比较占用你服务器的性能
考虑到减轻服务器性能方面,应当使用COOKIE。
4、单个cookie保存的数据不能超过4K,很多浏览器都限制一个站点最多保存20个cookie。

10.Koa2上传图片模块koa-multer

koa-multer是一个 node.js 中间件,用于处理 multipart/form-data 类型的表单数据,它主要用于上传文件。它是写在 busboy 之上非常高效。

注意: Multer 不会处理任何非 multipart/form-data 类型的表单数据,意思就是我们要上传图片必须在form表单上面加 multipart/form-data
安装:npm install --save koa-multer

10.1 引入配置koa-multer模块

const multer = require('koa-multer');
//配置    
var storage = multer.diskStorage({
    //文件保存路径
    destination: function (req, file, cb) {
        cb(null, 'public/uploads/')  //注意路径必须存在
    },
    //修改文件名称
    filename: function (req, file, cb) {
        var fileFormat = (file.originalname).split(".");
        cb(null,Date.now() + "." + fileFormat[fileFormat.length - 1]);
    }
})


//加载配置
var upload = multer({ storage: storage })

10.2 使用koa-multer

router.post('/doAdd', upload.single('face'), async (ctx, next) => {
    ctx.body = {
        filename: ctx.req.file.filename,//返回文件名
        body:ctx.req.body
    }
});

10.3 使用koa-multer 上传多个图片

前台表单:后台:
router.post('/doAdd', upload.fields([{ name: 'pic', maxCount: 1 }, { name: 'aaa', maxCount: 1 }]),async (ctx)=>{
    console.log(ctx.req.files);
})

注意Form表单加上enctype="multipart/form-data"

11. koa2分页

11.1 数据库分页查询数据的原理算法

规则:规定每页20条数据的查询方式
查询第一页(page=1):
db.表名.find().skip(0).limit(20)

查询第二页(page=2):
db.表名.find().skip(20).limit(20)

查询第三页(page=3):
db.表名.find().skip(40).limit(20)

总结:分页查询的sql语句
db.表名.find().skip((page-1)*pageSize).limit(pageSize)

11.2 数据库分页方法封装

find方法封装

db.collection(collectionName).find(json1,{fields:attr}).skip(slipNum).limit(pageSize);

count方法封装

var result=  db.collection(collectionName).count(json);
result.then(function(data){
      resolve(data);
})

12.koa2如何允许跨域

12.1 安装 koa2-cors

npm install --save koa2-cors

12.2 引入 koa2-cors 并且配置中间件

var Koa = require('koa');
var cors = require('koa2-cors');
var app = new Koa();
app.use(cors());

13.Koa2设置全局变量

有时候我们需要设置一些全局的变量,在各个路由模块中使用,下面我们看看那Koa2如何设置全局变量,以及Koa2中如何和设置全局模板数据
Koa中设置全局变量可以通过 ctx.state.变量名 来设置 如下:

router.use(async (ctx,next)=>{
    //全局的G变量
    ctx.state.G={
        url:'http://www.itying.com',
        userinfo:ctx.session.userinfo,
        prevPage:ctx.request.headers['referer']   /*上一页的地址*/
    }
})

在路由中获取全局变量也是通过 ctx.state.变量名 来获取
我们通过 ctx.state.变量 设置的全局变量可以直接在模板用使用哦
如上代码: 如果在其他模块中使用变量 直接通过 ctx.state.G.url来调用
如果在模板中使用直接通过 <%=url%> 来获取

14.Koa2 RESTful Api接口

14.1 一个好的Koa2 RESTful Api接口设计必须考虑以下几点

1.协议:建议使用更安全的https协议

2.域名:尽量部署在专属域名下面,比如https://a.itying.com https://api.itying.com

3.应该将api的版本号放入URl中:
(1)比如: https://a.itying.com/api1/newslist https://a.itying.com/api2/newslist
(2)比如: https://a1.itying.com https://a2.itying.com

4.路径:在RESTful架构中,每个网址代表一种资源(resource),所以网址中建议不能有动词,只能有名词,而且所用的名词往往与数据库的表格名对应。一般来说,数据库中的表都是同种记录的"集合"(collection),所以API中的名词也应该使用复数。

5.http请求数据的方式:(7个HTTP方法:GET/POST/PUT/DELETE/PATCH/HEAD/OPTIONS)
GET(SELECT):从服务器取出资源(一项或多项)。
POST(CREATE):在服务器新建一个资源。
PUT(UPDATE):在服务器更新资源(客户端提供改变后的完整资源)。
DELETE(DELETE):从服务器删除资源。

还有三个不常用的HTTP请求方式。
HEAD:获取资源的元数据。
OPTIONS:获取信息,关于资源的哪些属性是客户端可以改变的。
PATCH(UPDATE):在服务器更新资源(客户端提供改变的属性)。
6、过滤方式、请求数据方式、返回数据、安全。

14.2 Koa2 RESTful Api接口 (get post put delete) 代码演示

router.get('/catelist',async (ctx)=>{
    var result=await DB.find('articlecate',{})
    //console.log(result);
    ctx.body={
        result:result
    };
})
//增加购物车数据
router.post('/addCart',async (ctx)=>{
    //接收客户端提交的数据 、主要做的操作就是增加数据
    console.log(ctx.request.body);
    ctx.body={
        "success":true,
        "message":'增加数据成功'
    };
})
//修改用餐人数的接口
router.put('/editPeopleInfo',async (ctx)=>{
    //接收客户端提交的数据 、主要做的操作就是修改数据
    console.log(ctx.request.body);
    ctx.body={
        "success":true,
        "message":'修改数据成功'
    };
})

//用于删除数据源
router.delete('/deleteCart',async (ctx)=>{
    //接收客户端提交的数据 、主要做的操作就是删除数据的操作
    console.log(ctx.query);
    ctx.body={
        "success":true,
        "message":'删除数据成功'
    };
})

15.koa2 网站开启gzip压缩

15.1 安装koa-compress中间件

cnpm install koa-compress --save

15.2 配置koa-compress中间件

const koa = require('koa');
const compress = require('koa-compress');
const app = koa();
const options = { threshold: 2048 };
app.use(compress(options));

内容引用:https://www.itying.com/koa/article-index-id-79.html

相关文章

  • koa2 用到的中间件

    koa-router //koa路由 koa-bodyparser //post 获取值 koa-stat...

  • koa-router处理URL

    koa-router处理URL koa-router使用的结构const Koa = require('koa')...

  • koa 自学入门

    const Koa = require('koa');const route = require('koa-rou...

  • 初见 Koa 2

    koa 和 koa 2 最大的不同是koa 2 支持 async/await。koa 通过结合 generato...

  • trello01:后端搭建

    开发依赖: koa : 后端的主框架。 koa-router:基于Koa的路由。 koa-static-cache...

  • Koa2教程(常用中间件篇)

    目录一、koa-bodyparser二、koa-router三、koa-views + ejs四、koa-stat...

  • koa2设置跨域

    npm install --save koa2-corsvar Koa = require('koa');var ...

  • koa

    koa 学习 中间件 koa-router koa-router 获取get/post请求参数 koa-bodyp...

  • koa2 入门教程

    koa koa 中文koa-generator 简介 koa 是一个新的 web 框架, 由 express 原班...

  • UMI 服务端渲染

    Umi 开启服务端渲染: 安装 koa、koa-compress、 koa-mount、koa-static、ko...

网友评论

      本文标题:koa

      本文链接:https://www.haomeiwen.com/subject/hhatoltx.html