使用Koa2进行Web开发(二)静态文件与路由
来源:互联网 发布:淘宝怎么提高销量2016 编辑:程序博客网 时间:2024/06/07 05:18
静态文件处理
这里选择koa-static作为处理静态文件的中间件
const Koa = require('koa');const app = new Koa();const serve = require("koa-static");app.use(serve(__dirname+ "/static/html",{ extensions: ['html']}));app.listen(3000);
static模块的使用也比较简单,规划好静态文件存放的路径,使用app.use挂载在应用上即可。
上面的代码中,__dirname+ “/static/html” 表示静态文件存放的路径,当接收到请求后,会在该路径下进行查找,serve还可以接收一个对象,表示查找文件的后缀名。
路由处理
在express中,路由处理的中间件是绑定在内部的,因此可以使用如下的代码
app.get(“/”,function(req,res){ //TODO})
在KOA中,由于移除了不必要的中间件,路由的处理同样要借助第三方模块来实现,这里使用koa-router
和express中注册路由的写法相同,router对象分别使用get和post方法来处理get和post请求。
下面是一个使用koa-router的例子
var Koa = require('koa');var bodyParser = require('koa-bodyparser');const router = require('koa-router')();var app = new Koa();app.use(bodyParser());app.use(router.routes());router.get('/', async (ctx, next) => { ctx.response.body = '<h1>Index</h1> <form action="/login" method="post"> ' + '<p>Name: <input name="name"></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 || '', password = ctx.request.body.password || ''; console.log(ctx.request); if (name === 'koa' && password === '12345') { ctx.body = "Success" } else { ctx.body = "Login error" }});
上面的代码中,我们定义了两个路由,接收到get请求后向前端渲染一个form表单用于登陆,当用户点击submit提交后,router接收到post请求后使用ctx.request.body
对象来解析表单中的字段,但实际上将post的请求打印出来
console.log(ctx.request);
会发现resquest对象并没有body这一字段,思考post请求的原理即可明白,由于表单提交可能划分为多个包进行传输,因此放在request对象中显然是不合理的,程序可以使用ctx.request.body来解析表单字段,是因为使用了koa-bodyparser这一模块的原因,至于该模块内部是如何实现的,读者可以自行参阅源码
{ method: ‘POST’,
url: ‘/login’,
host:{
‘localhost:3000’,
connection: ‘keep-alive’,
‘content-length’: ‘29’,
‘cache-control’: ‘max-age=0’,
origin: ‘http://localhost:3000‘,
‘upgrade-insecure-requests’: ‘1’,
‘user-agent’: ‘Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_3) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/57.0.2987.133
Safari/537.36’,
‘content-type’: ‘application/x-www-form-urlencoded’,
accept: ‘text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,/;q=0.8’,
referer: ‘http://localhost:3000/login‘,
‘accept-encoding’: ‘gzip, deflate, br’,
‘accept-language’: ‘zh-CN,zh;q=0.8,en;q=0.6,ja;q=0.4’,
cookie: ‘_ga=GA1.1.910420953.1491570843’ } }
因为router也是中间件,因此要使用app.use()来挂在app对象中,值得注意的是,bodypaser要在router之前加载才能生效。
koa-router同样支持定义定义多种形式的路由,下面是官网的例子
router.get('/:category/:title', function (ctx, next) { console.log(ctx.params); // => { category: 'programming', title: 'how-to-node' }});router.get(/^\/(.*)(?:\/|$)/, ...); // match all path, e.g., /hello, /hello/worldrouter.get(/^\/app(?:\/|$)/, ...); // match all path that start with "/app", e.g., /app/hello, /app/hello/world
在上面的代码中:category和:title实际上起到了get参数的作用,这种restful风格的地址传递相比使用?category=.. &title=的形式更加简洁,要获取这种形式的参数,可以使用ctx.params对象。
router.get("/delete/blog/:blogId",async(ctx,next)=>{ await dbAPI.deleteBlogId(ctx.params.blogId); await next()})
- 使用Koa2进行Web开发(二)静态文件与路由
- 使用Koa2进行Web开发(一)
- 用newlisp开发网站二 静态文件路由
- 静态路由(二)
- 路由基础(二)静态路由
- MVC 入门路由选择二 定义默认值与静态路由
- Web开发中的"路由"是什么意思?(关键词:Web开发/路由)
- Node.js进行Web开发(一)--Express,路由控制,模板引擎
- 使用NetBeans进行J2ME开发(二)
- 静态路由与默认路由( 原理+区别+实例)
- 静态路由与默认路由( 原理+区别+实例)
- 交换与路由练习(三、生成树 静态路由)
- 路由基础(四)静态路由与SLA技术
- [Python] 利用Django进行Web开发系列(二)
- 使用Express进行Web开发
- 使用Nodejs进行web开发
- Koa2-下载-文件流
- Koa2文件上传
- 自然图像中的logo识别和定位:Logo localization andrecognition in natural images using homographic class graphs
- Java-LeetCode-DecodeWays
- The content of the adapter has changed but ListView did not receive a notification
- [BZOJ4555][Tjoi2016&Heoi2016]求和(NTT)
- 前端学HTTP之web攻击技术
- 使用Koa2进行Web开发(二)静态文件与路由
- 青蛙跳台问题
- 题目1377:缓变序列
- SQL Server中行列转换 Pivot UnPivot
- Tips on non-standard evaluation in R
- org.hibernate.NonUniqueObjectException
- 基于Opencv平台开发的程序在其它电脑上独立运行
- CSU 1898: 复盘拉火车
- 【LeetCode】Convert Sorted Array to Binary Search Tree 解题报告