100-days-Coding - day9

2018-08-12 本文已影响0人亨利何

day9-0812

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

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

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

koa服务器的开启
koa的表单处理中间件koa-body
promise的使用 - 「是在没想到koa使用promise到这种地步」
async & await - 「老生畅谈 - 异步，同步糟心事惹」
imdb-api的简单使用 - 「之前有用unsplash的api做过一个每日推送美图的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提供的电影信息

The ant man

使用比较简单拥有一个omdb_key就可以啦！「daily 1000 times」
可以展开你的想法，「做出好玩的东西哦！」

#End preference

阮一峰的koa框架教程
阮一峰的异步编程的方法
ps: 常看大神博客有利于健康成长

100-days-Coding - day9

day9-0812

猜你喜欢

热点阅读