Koa的基本使用

最新推荐文章于 2024-05-10 15:20:42 发布
最新推荐文章于 2024-05-10 15:20:42 发布
阅读量200 收藏 1
点赞数 1
分类专栏： 前端积累 文章标签： node.js javascript vue.js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/L20150514/article/details/120587655
版权

1. 安装

在这里插入图片描述

2. 路由中间件

  • 安装 cnpm i koa-router -D
  • const koa = require('koa');
const Router = require('koa-router');

let server = new koa();
server.listen(8080);

let router = new Router();

router.get('/a', async (ctx, next) => {
    ctx.body = 'aaa';
});


server.use(router.routes());
    在这里插入图片描述

2.1 嵌套路由

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

let server = new koa();
server.listen(8080);

let router = new Router();
let router1 = new Router();
let router2 = new Router();
let router3 = new Router();

// /a
router1.get('/a', async ctx => {
    ctx.body = '一级路由';
});
//  /a/b
router2.get('/b', async ctx => {
    ctx.body = '二级路由';
});



router1.use('/a',router2.routes());

router.use(router1.routes());
server.use(router.routes());

在这里插入图片描述

2.2 路由参数

  • params

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

let server = new Koa();
server.listen(8080);

let router = new Router();

router.get('/news/:id1/:id2/:id3', async ctx => {
    console.log(ctx.params);

    let {
        id1,
        id2,
        id3
    } = ctx.params;

    ctx.body = `新闻${id1},${id2},${id3}`;
});


server.use(router.routes());

    在这里插入图片描述
    在这里插入图片描述
    利于SEO

  • urlencoded

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

let server = new Koa();
server.listen(8080);

let router = new Router();

router.get('/news', async ctx => {
    // 获取客户端传递过来的数据
    console.log(ctx.query);
});


server.use(router.routes());

    在这里插入图片描述
    不利于SEO

3. ctx对象

3.1 可以将一些全局的东西往 server.context上加

  • 	const Koa = require('koa');
	const Router = require('koa-router');
	
	let server = new Koa();
	server.listen(8080);
	
	let router = new Router();
	
	
	server.context.a = 134;
	router.get('/news', async ctx => {
	    
	
	    console.log(ctx.a);
	});
	
	
	server.use(router.routes());
    在这里插入图片描述

3.2 信息类

ctx.request 和 ctx.response 是原始的 request和response 对象

  • ctx.method 请求方法
  • ctx.url 请求地址
  • ctx.path 路径
  • ctx.query get的数据
  • ctx.ip 客户端的IP
  • ctx.headers 请求头
  • crx.state 状态码

3.3 方法类

  • ctx.throw(code,msg) 报错并且退出 
    • const Koa = require('koa');
const Router = require('koa-router');

let server = new Koa();
server.listen(8080);

let router = new Router();


router.get('/login', async ctx => {
    if (!ctx.query.user) {
        ctx.throw(400, 'user is required');
    } else {
        ctx.body('success');
    }

});


server.use(router.routes());
      在这里插入图片描述
  • ctx.assert(条件,code,msg) 
    • const Koa = require('koa');
const Router = require('koa-router');

let server = new Koa();
server.listen(8080);

let router = new Router();

router.get('/login1', async ctx => {

    ctx.assert(ctx.query.user, 400, 'user is required')
});


server.use(router.routes());
      在这里插入图片描述
  • ctx.redirect() 重定向
  • const Koa = require('koa');
const Router = require('koa-router');

let server = new Koa();
server.listen(8080);

let router = new Router();


router.get('/login', async ctx => {
    ctx.redirect('/news');
});


server.use(router.routes());
    在这里插入图片描述
    • ctx.attachment() 帮用户下载文件

4. 中间件

4.1 静态文件中间件 (koa-static)

  • 安装 cnpm i koa-static -D

  • 	const Koa = require('koa');
	const Router = require('koa-router');
	const static = require('koa-static');
	
	let server = new Koa();
	server.listen(8080);
	
	
	
	// 静态文件
	server.use(static('./static/', {
	    maxAge: 86400 * 1000, //缓存时间
	    index: '1.html' // 默认文件
	}));

    在这里插入图片描述
    在这里插入图片描述

    在这里插入图片描述
    在这里插入图片描述 缓存时间

    • 针对不同的文件 设置缓存时间 
      • const Koa = require('koa');
const Router = require('koa-router');
const static = require('koa-static');

let server = new Koa();
server.listen(8080);


// 针对不同的文件 缓存的时间也不同
let staticRouter = new Router();
// 图片文件
staticRouter.all(/\.jpg|\.gif|\.png/i, static('./static/', {
    maxAge: 60 * 86400 * 1000
}));

// html文件
staticRouter.all(/\.html|\.htm|\.shtml/i, static('./static/', {
    maxAge: 20 * 86400 * 1000
}));

// css文件
staticRouter.all(/\.css/i, static('./static/', {
    maxAge: 1 * 86400 * 1000
}));

// 剩余的
staticRouter.all('', static('./static/', {
    maxAge: 30 * 86400 * 1000
}));


server.use(staticRouter.routes());
        html在这里插入图片描述
        css在这里插入图片描述
        图片在这里插入图片描述

4.2 解析 post 数据 (koa-better-body)

  • 安装 cnpm i koa-better-body -D

  • 服务器

    • const Koa = require('koa');
const body = require('koa-better-body');

let server = new Koa();
server.listen(8080);


server.use(body({
    uploadDir: './static/'
}))

server.use(async ctx=>{
    // 普通数据  文件数据  都在这上面
    console.log(ctx.request.fields);
    ctx.body = 'aaa';
})

  • 客户端

    • <!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
</head>

<body>
    <form action="http://localhost:8080" method="POST" enctype="multipart/form-data">
        <input type="text" name="user"><br>
        <input type="file" name="f1"><br>
        <input type="submit" value="提交">
    </form>
</body>

</html>

  • 结果

    在这里插入图片描述
    在这里插入图片描述

5. cookie

  • const Koa = require('koa');

let server = new Koa();
server.listen(8080);


// 秘钥
server.keys = [
    'afdsafsd',
    'afdsafdasfsa',
    'safdsafsdaljfkl',
];

server.use(async ctx => {
    // 设置 cookie
    ctx.cookies.set('user', 'blue', {
        maxAge: 14 * 86400 * 1000, //有效期
        signed: true //是否签名
    });


    // 获取 cookie
    console.log(ctx.cookies.get('user', {
        signed: true // 验证 cookie
    }));
})
    在这里插入图片描述

6. session

  • 安装 cnpm i koa-session -D
  • const Koa = require('koa');
const session = require('koa-session');


let server = new Koa();
server.listen(8080);


// 强制签名
server.keys = [
    'afdsafdsaf',
    'afdsafdsafdsafds',
    'afdsalkfjdk'
];

server.use(session({
    key: 'asfsda', //修改session的名字
    maxAge: 20 * 60 * 1000, //session有效期
    renew: true //自动续期
}, server));


server.use(async ctx => {
    if (!ctx.session['views']) {
        ctx.session['views'] = 0;
    }
    ctx.session['views']++;

    ctx.body = `欢迎您第${ctx.session.views}次来访`;
})
    在这里插入图片描述

7. 数据库

  • 安装 cnpm i mysql co-mysql -D
  • const Koa = require('koa');
const mysql = require('mysql');
const co = require('co-mysql');

// 连接数据库
let conn = mysql.createPool({
    host: 'localhost',
    user: 'root',
    password: 'root',
    database: 'test'
});
let db = co(conn);

let server = new Koa();
server.listen(8080);

// 将  db 放到全局 方便使用
server.context.db = db;

server.use(async ctx => {
    // 执行 sql 语句
    let data = await ctx.db.query('SELECT * FROM sc');

    ctx.body = data;
})
    在这里插入图片描述

8. 错误处理

  • 服务级别错误处理

    const Koa = require('koa');

let server = new Koa();
server.listen(8080);


// 服务级别错误处理
server.use(async (ctx, next) => {
    try {
        await next();
    } catch (e) {
        ctx.body = '错了';
    }
});

server.use(async ctx => {
    ctx.body = data;
});

    在这里插入图片描述

  • router 错误处理

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

let server = new Koa();
server.listen(8080);

let router = new Router();

router.all(/.*/, async (ctx, next) => {
    try {
        await next();
    } catch (e) {
        ctx.body = '错了 -- router';
    }
});

router.get('/a', async ctx => {
    ctx.body = div;
});
router.get('/b', async ctx => {
ctx.body = 'bbb';
});

server.use(router.routes());

    在这里插入图片描述

9. 服务端渲染

9.1 pug

  • 侵入式
  • 安装 cnpm i pug -D
  • 在这里插入图片描述
  • const pug = require('pug');

pug.renderFile('./template/1.pug', {
    pretty: true, //美化
    div: '动态添加',
    users: [{
        name: 'xxx',
        password: '123321'
    },{
        name: 'aaa',
        password: '123321'
    }]
}, (err, data) => {
    if (err) {
        console.log('渲染失败');
    } else {
        console.log(data);
    }
});
  • 在这里插入图片描述

9.2 ejs

  • 安装 cnpm i ejs -D
  • <!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
</head>

<body>
    <%= name%>
    <ul>
        <%arr.forEach(item=>{%>
        <li>
            <%= item%>
        </li>
        <%})%>
    </ul>
</body>

</html>

  • const ejs = require('ejs');

ejs.renderFile('./template/1.ejs', {
    name: 1,
    arr: [1, 2, 3]
}, (err, data) => {
    if (err) {
        console.log(err);
    } else {
        console.log(data);
    }
});
  • 在这里插入图片描述
  • ejs中引入其他 ejs文件

    • 文件 2

      <header>
    <nav>
        待引入进来的
    </nav>
</header>

    • 引入文件2

      <!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
</head>

<body>

    <%- include('2.ejs') %>
    <ul>
        <%arr.forEach(item=>{%>
        <li>
            <%= item%>
        </li>
        <%})%>
    </ul>
</body>

</html>

    • 服务器代码

      const ejs = require('ejs');

ejs.renderFile('./template/1.ejs', {
    name: 1,
    arr: [1, 2, 3]
}, (err, data) => {
    if (err) {
        console.log(err);
    } else {
        console.log(data);
    }
});

    • 结果

      在这里插入图片描述

10. koa使用ejs

  • 安装 cnpm i koa-ejs -D
  • ejs
    <!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
</head>

<body>

    <%- include('2.ejs') %>
    <ul>
        <%arr.forEach(item=>{%>
        <li>
            <%= item%>
        </li>
        <%})%>
    </ul>
</body>

</html>
  • 服务器
    const Koa = require('koa');
let ejs = require('koa-ejs');
const path = require('path');

let server = new Koa();
server.listen(8080);



ejs(server, {
    root: path.resolve(__dirname, 'template'), //去哪儿找模板文件
    layout: false,
    viewExt: 'ejs', //视图文件的扩展名
    cache: false, //是否缓存
    debug: false
});

server.use(async (ctx) => {
    await ctx.render('1', {
        arr: [21, 232, 43]
    })
})
  • 结果
    在这里插入图片描述
成长路上都是孤独的
关注
  • 1
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
koa2入门之使用koa-generator生成koa2项目
安树的博客
12-26 2万+
1、新建项目目录，我这边是在E盘的nodejs目录下面进行安装的，所以先在E盘创建nodejs目录 2、打开命令行窗口。安装koa-generator，安装命令为： npm install -g koa-generator 安装完成之后进入通过命令进入E盘的nodejs目录 3、使用koa-generator生成koa2项目，输入命令： koa2 test_koa 4、创建
关于express与koa的使用对比详解
08-28
例如，下面是Express和Koa处理请求的基本示例： 在Express中： ```javascript const express = require('express'); const app = express(); app.get('/', (req, res) => { res.send('Hello from Express!'); });...
koa的基本使用
hjhfreshman的博客
08-02 344
主要实现了以下几个知识点： 1.koa中的路由如何引入 2.处理get请求，及获取参数 3.处理post请求，及获取参数 4.使用中间件koa-bodyparser（获取请求参数），koa-static（解析静态文件）， 5.操作封装后的mongodb数据库，如何封装可以看我之前的文章：封装koa操作mongodb数据库方法 直接上代码，对应功能有注释 const koa = require("koa") const router = require("koa-router")() // 路由 const
学习使用koa框架
最新发布
weixin_43922786的博客
05-10 888
koa的基本使用
koa框架的基本使用
xiasohuai的博客
03-07 3229
1.Koa介绍 Koa 是基于 Node.js 平台的下一代 web 开发框架。 Koa是由 Express 原班人马打造的，致力于成为一个更小、更富有表现力、更健壮的 Web 框架。 使用 Koa编写 web 应用，可以免除重复繁琐的回调函数嵌套， 并极大地提升错误处理的效率。Koa不在内核方法中绑定任何中间件， 它仅仅提供了一个轻量优雅的函数库，使得编写 Web 应用变得得心应手，开发思路和 Express 差不多，最大的特点就是可以避免异步嵌套 2.Koa的安装和基本使用 （1）koa..
【Nodejs】Koa基本使用
DomCode
07-26 594
koa是由 Express 原班人马打造的，致力于成为一个更小、更富有表现力、更健壮的 Web 框架。使用 koa 编写 web 应用，通过组合不同的 generator，可以免除重复繁琐的回调函数嵌套，并极大地提升错误处理的效率。koa 不在内核方法中绑定任何中间件，它仅仅提供了一个轻量优雅的函数库，使得编写 Web 应用变得得心应手。
Koa的使用
nanxing的博客
10-01 625
Koa的使用Koa初体验Koa中间件：路由的使用params和query参数解析json数据解析x-www-form-urlencoded数据解析form-data数据解析Koa数据响应响应结果响应码静态资源服务器错误处理 Koa初体验 安装：npm install koa const Koa = require("koa"); const url = require("url"); const app = new Koa(); // 注册中间件 app.use((ctx, next) => {
使用nodejs的koa框架连接MongoDB数据库.zip
11-05
至此，你已经学会了如何使用Node.js的Koa框架连接MongoDB数据库并进行基本的数据操作。这个基础可以进一步扩展到更复杂的Web应用，包括用户认证、数据验证、分页、聚合查询等功能。在实际项目中，还可以考虑使用ORM...
Koa框架教程
01-27
在开始使用Koa之前，确保你的Node.js版本在7.6或以上，因为Koa需要这个版本或更高来支持ES6的async/await特性。你可以通过`node -v`命令来检查你的Node版本。如果需要升级，可以访问Node.js官网下载最新版进行安装。...
node-koa:koa基本学习
04-27
Koa 强调了中间件的使用，使得代码更加模块化，易于理解和维护。与 Express 相比，Koa 更加轻量级，它没有内置的路由或视图层，这些功能通常由开发者自定义或者选择第三方库来实现。 **中间件机制** Koa 的核心...
Koa项目搭建过程详细记录
08-27
Koa项目搭建过程需要了解Koa的基本概念和常用中间件的使用方法，包括koa-generator的使用、常用中间件的介绍和路由控制的开发。通过本篇文章，读者可以了解Koa项目搭建的详细过程，并掌握Koa项目开发的基本技能。
koa基本使用
qq_45768871的博客
02-09 1497
koa 基本使用 var Koa = require('koa'); var Router = require('koa-router'); var app = new Koa(); var router = new Router(); /* koa 中间件 */ app.use(async(ctx, next) => { console.log(new Date()) await next(); }) router.get('/', (ctx, next
koa 使用
gronkie的博客
12-19 715
1. koa 是什么 2. ctx 参数 3. next 参数 4. request 对象 5. response 对象 6. koa1，koa2 和 express 的区别
使用 koa
SS
08-14 1329
环境nodejs: v0.12.7 koa: v0.21.0koa 是这样介绍自己的 Koa 应用是一个包含中间件 generator 方法数组的对象。当请求到来时, 这些方法会以 stack-like 的顺序执行, 从这个角度来看，Koa 和其他中间件系统（比如 Ruby Rack 或者 Connect/Express ）非常相似. 然而 Koa 的一大设计理念是: 通过其他底层中间件层提供高
koa 用法
starwmx520的博客
04-18 1334
var koa = require('koa');//引用 var app = koa();//创建不需要new  //中间件中yield next 将控制权交给下一个符合的中间件。 //当最终的中间件执行完，会去执行被挂起的next后的代码。一直逆推而上。 //以下执行顺序  aa  bb body  逆推 输出时间  最后cc  app.use(function *(next){
Koa使用教程
sinat_38832964的博客
06-26 1978
一、KOA准备–搭建本地服务器 1、首先创建一个目录 koa-app ，用相关工具打开 使用 npm init --yes 命令生成package.json 文件 新建 app.js 2、安装 KOA npm install koa koa-router -s 3、在 app.js 中写入： //引入模块 const Koa = require('koa'); ...
Koa的基础用法
qq_53776079的博客
11-18 927
话不多说 我们直入正题 首先如何启动一个koa项目 1.创建一个新项目 2.npm init -y初始化package.json文件 npm init -y 3.通过终端或者命令用npm 或者yarn去安装koa、koa-router到dependencies npm install koa npm install koa-router 4.安转nodemon npm add nodemon -D 5.添加一条npm scripts命令，"start":"nodemon ap
node——koa基本使用
奔跑的程序员
08-14 826
const Koa= require("koa"); const app = new Koa(); const router = require('koa-router')(); const userRoute = require('./routes/userRoute.js'); const sysRoute = require('./routes/systemRoute.js') rou...
koa-router怎么使用的
04-14
Koa-router 是一个基于 Koa 的路由中间件，用于处理 URL 路由。它通过 Koa 的中间件机制，可以方便地实现路由功能。在使用 Koa-router 前，首先需要通过 npm 安装： ...这样就完成了 Koa-router 的基本使用。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值