继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

100-days-Coding - day9

慕标5832272
关注TA
已关注
手记 1229
粉丝 229
获赞 1001

day9-0812

上次在用form做文件上传的时候,自己方便测试使用koa搭建了一个临时后台「其实很早之前就已经接触了,express的替代者,更轻量化,富中间件化

koa的使用虽然也只是简单的了解层面,不过还是get到一些不一样的事情

从一个简单的form表单引申出的都有什么呢?

  • koa服务器的开启

  • koa的表单处理中间件koa-body

  • promise的使用 - 「是在没想到koa使用promise到这种地步」

  • async & await - 「老生畅谈 - 异步,同步糟心事惹」

  • imdb-api的简单使用 - 「之前有用unsplashapi做过一个每日推送美图的vueapp

细想一下,哇咔咔,还是有好多新坑需要填。


#1. koa的服务器开启

koa作为express的替代者,达到同样目的情况下给人一种简洁的美

const Koa = require('koa');const app = new Koa();const main = ctx => {
    ctx.response.body = 'serer ha, gotcha!'}

app.use(main)

app.listen(3006, () => {    console.log('server running ...')
})
  • main作为服务器相应主函数,知道你想使用路由,直接判断ctx.request.path === your_path就可以啦!- 「原生的哦

  • 当然,路由也可以使用中间件koa-route。「要自己去查哦!」

#2. koa-body中间件

为了能够获取前端传来的form表单的数据你需要获取post data 或者是get parameters,来进行相应的处理

const Koa = require('koa');const koaBody = require('koa-body');const app = new Koa();// 文件处理const main = async function(ctx) {  const files = ctx.request.body.files // get your files with body.files};

app.use(koaBody({ multipart: true }));
app.use(main)

app.listen(3006, () => {
  
    console.log('server running ...')
})
  • 文件的处理需要async的帮助,不止是文件处理,还有其他的异步操作,比如ajax的数据请求,原因是「REASON

#3. promise的使用

promise的语法糖真的是好甜!
使用promise的写法不仅可以更清楚的表达你的逻辑,更重要的是很

const queryMovie = (movie) => {    return new Promise((resolve, reject) => {
        imdb.get({            name: movie            // id: 'tt3896198'
        }, {            apiKey: OMDB_KEY_HONGWING,            timeout: 30000
        }).then((res) => {            // 数据正常就是 resolve
            resolve(res)
        }).catch((e) => {           // 数据异常就是 reject
            reject(e)
        })
    })
    
}
  • 简单点来说,就是将函数的执行就类似于pipe。倘若达到你的条件,就会流向你该条所导向的地方 - 「resolve & reject

  • Note: 经常的使用会有助于你将你的代码逻辑转向promise,更加清楚真个逻辑流程 「不要强行使用哦!

#4. async & await 再次相遇

F.E.D始终逃不掉的就是异步 & 同步「 REASON 」Javascript with single thread
异步的常见的会有: 回调函数,发布订阅,时间驱动处理,和 promise

const movieQuery = async function (ctx) {    const moviename = ctx.request.url.split('?')[1].split('=')[1]    await queryMovie(moviename).then((res) => {        console.log(res)
        ctx.body = res
    }).catch((e) => {
        ctx.body = e
    })
};
  • async表明了函数是异步执行的,这个异步执行的函数内部使用了await表明了需要在执行 queryMovie() - ajax时等一下即同步

  • Note: 「四种常见的写法记得去看看哦!

#5. imdb-api 相关

imdb-api是一个包,用于获取imdb提供的电影信息



作者:亨利何
链接:https://www.jianshu.com/p/977e3a76f3ea


打开App,阅读手记
0人推荐
发表评论
随时随地看视频慕课网APP