koa2入门(2) koa-router 路由处理
项目地址:https://github.com/caochangkui/demo/tree/koa-test
1. 创建项目
- 创建目录 koa-test
- npm init 创建 package.json,然后执行 npm install
- 通过 npm install koa 安装 koa 模块
- 通过 npm install supervisor 安装supervisor模块, 用于node热启动
- 在根目录下中新建 koa.js 文件,作为入口文件, 内容如下:
const Koa = require('koa'); // Koa 为一个class
const app = new Koa();
app.use(async (ctx, next) => {
await next();
ctx.response.body = 'Hello, koa2!';
});
app.listen(3333, () => {
console.log('This server is running at http://localhost:' + 3333)
})
- 配置 package.json 文件
{
"name": "koa-test",
"version": "1.0.0",
"description": "",
"main": "koa.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"serve": "supervisor koa.js"
},
"author": "",
"license": "ISC",
"dependencies": {
"koa": "^2.7.0",
"supervisor": "^0.12.0"
}
}
- 启动项目, 打开 http://localhost:3333 即可
$ npm run serve
打开页面后,显示 hello koa2
2. 根据请求路径显示不同页面
更改 koa.js
const Koa = require('koa'); // Koa 为一个class
const app = new Koa();
app.use(async (ctx, next) => {
await next();
if (ctx.request.path == '/about') {
ctx.response.type = 'html'; // 指定返回类型为 html 类型
ctx.response.body = 'this is about page <a href="/">Go Index Page</a>';
} else {
ctx.response.body = 'this is index page';
}
});
app.listen(3333, () => {
console.log('This server is running at http://localhost:' + 3333)
})
访问:http://localhost:3333/about 显示:this is about page Go Index Page
3. koa-router 路由管理模块的使用
koa-router 是一个处理路由的中间件
$ npm i koa-router
修改koa.js
const Koa = require('koa'); // Koa 为一个class
const Router = require('koa-router') // koa 路由中间件
const app = new Koa();
const router = new Router(); // 实例化路由
// 添加url
router.get('/hello/:name', async (ctx, next) => {
var name = ctx.params.name; // 获取请求参数
ctx.response.body = `<h5>Hello, ${name}!</h5>`;
});
router.get('/', async (ctx, next) => {
ctx.response.body = '<h5>Index</h5>';
});
app.use(router.routes());
app.listen(3333, () => {
console.log('This server is running at http://localhost:' + 3333)
})
也可给路由统一加个前缀:
const router = new Router({
prefix: '/api'
});
然后访问 http://localhost:3333/api 即可,例如:http://localhost:3333/api/hello/koa2
4. post 请求
koa2 需要使用 koa-bodyparser 中间件来处理post请求
$ npm i koa-bodyparser
修改 koa.js
const Koa = require('koa'); // Koa 为一个class
const Router = require('koa-router') // koa 路由中间件
const bodyParser = require('koa-bodyparser'); // 处理post请求,把 koa2 上下文的表单数据解析到 ctx.request.body 中
const app = new Koa();
const router = new Router(); // 实例化路由
app.use(bodyParser())
// 表单
router.get('/', async (ctx, next) => {
ctx.response.body = `<h1>表单</h1>
<form action="/login" method="post">
<p>Name: <input name="name" value="koa2"></p>
<p>Password: <input name="password" type="password"></p>
<p><input type="submit" value="Submit"></p>
</form>`;
});
router.post('/login', async (ctx, next) => {
let name = ctx.request.body.name;
let password = ctx.request.body.password;
console.log(name, password);
ctx.response.body = `<h4>Hello, ${name}!</h4>`;
});
app.use(router.routes());
app.listen(3333, () => {
console.log('This server is running at http://localhost:' + 3333)
})
koa2入门(2) koa-router 路由处理的更多相关文章
- koa2入门--03.koa中间件以及中间件执行流程
//中间件:先访问app的中间件的执行顺序类似嵌套函数,由外到内,再由内到外 //应用级中间件 const koa = require('koa'); var router = require('ko ...
- KoaHub平台基于Node.js开发的Koa router路由插件代码信息详情
koa-router Router middleware for koa. Provides RESTful resource routing. koa-router Router mid ...
- koa2入门--02.koa2路由
首先输入在项目文件下使用cmd,输入 npm install koa-router --save const koa = require('koa');//引入koa const Router = r ...
- Angular 从入坑到挖坑 - Router 路由使用入门指北
一.Overview Angular 入坑记录的笔记第五篇,因为一直在加班的缘故拖了有一个多月,主要是介绍在 Angular 中如何配置路由,完成重定向以及参数传递.至于路由守卫.路由懒加载等&quo ...
- koa2入门使用总结
koa2的介绍 Koa 是一个新的 web 框架,由 Express 幕后的原班人马打造, 致力于成为 web 应用和 API 开发领域中的一个更小.更富有表现力.更健壮的基石. 通过利用 async ...
- 手写@koa/router源码
上一篇文章我们讲了Koa的基本架构,可以看到Koa的基本架构只有中间件内核,并没有其他功能,路由功能也没有.要实现路由功能我们必须引入第三方中间件,本文要讲的路由中间件是@koa/router,这个中 ...
- 前端MVC Vue2学习总结(八)——Vue Router路由、Vuex状态管理、Element-UI
一.Vue Router路由 二.Vuex状态管理 三.Element-UI Element-UI是饿了么前端团队推出的一款基于Vue.js 2.0 的桌面端UI框架,手机端有对应框架是 Mint U ...
- 全面解析JavaScript的Backbone.js框架中的Router路由
这篇文章主要介绍了Backbone.js框架中的Router路由功能,Router在Backbone中相当于一个MVC框架中的Controller控制器功能,需要的朋友可以参考下. Backbone ...
- React初识整理(四)--React Router(路由)
官网:https://reacttraining.com/react-router 后端路由:主要做路径和方法的匹配,从而从后台获取相应的数据 前端路由:用于路径和组件的匹配,从而实现组件的切换. 如 ...
- hbuilderX创建vue项目之添加router路由(前端萌新)
作为一个刚刚接触前端不久的新人来说,熟悉了一种目录结构或者项目创建方法以后,恨不得一辈子不会变! 可是人要生活,就要工作,既然是打工,当然要满足雇佣者的要求. 今天我来说说 hbuilderX 这个开 ...
随机推荐
- Python不可变对象
str是不变对象,而list是可变对象. 对于不可变对象,比如对str进行操作: # 对于list进行操作,list内部的内容是会变化的: >>> a = ['c', 'b', 'a ...
- Azure 标准与高级托管磁盘存储的相互转换
托管磁盘提供两种存储选项:高级(基于 SSD)和标准(基于 HDD). 它允许基于性能需求在这两个选项之间轻松切换,并保障最短停机时间. 非托管磁盘不具备此功能. 但可以轻松转换为托管磁盘,以便在这两 ...
- python第六十三天-- 第十一周作业
题目:基于RabbitMQ rpc实现的主机管理 需求: 可以对指定机器异步的执行多个命令例子:>>:run "df -h" --hosts 192.168.3.55 ...
- Sql_server基本操作
使用Sql_server创建表,视图,触发器,存储过程,函数等基本操作. create table test1( /* 创建一个表 */ num int ) alter table test1 /* ...
- 关于SQL Server将一列的多行内容拼接成一行,合并显示在另外表中
select '['+title_a+','+title_b +']' from A for xml path('') SELECT *, (select '['+title_a+','+titl ...
- 让bootstrap-table支持高度百分比
更改BootstrapTable.prototype.resetView 方法,以支持高度百分比定义,适应不同高度屏幕 BootstrapTable.prototype.resetView = fun ...
- 【PAT】B1067 试密码(20 分)
注意读取时的换行符用getchar吸收 第十个错误后直接输出锁定 #include<cstdio> #include<string.h> int main(){ char mi ...
- 【PAT】B1081 检查密码(15 分)
水题 #include<cstdio> #include<string.h> #include<ctype.h> #include<algorithm> ...
- 17秋 软件工程 团队第五次作业 Alpha Scrum5
17秋 软件工程 团队第五次作业 Alpha Scrum5 今日完成的任务 世强:消息通知管理列表页界面编写,下拉加载效果: 港晨:编写登录界面: 树民: 伟航:学习了flask_restful框架的 ...
- 【Beta Scrum】冲刺! 1/5
0. Alpha阶段遗留问题 项目 功能/页面 功能/页面 WEB端 图片在线编辑 文件上传跨域问题 app端 作业展示页面 1. Beta计划表 功能 说明 web端 登录 完成web端登录页面及功 ...