重拾koa2之JSONP

在项目复杂的业务场景，有时候需要在前端跨域获取数据，这时候提供数据的服务就需要提供跨域请求的接口，通常是使用JSONP的方式提供跨域接口。

原生koa2实现jsonp

const Koa = require('koa2')
const app = new Koa()

app.use(async ctx=>{
    //如果jsonp的请求未GET
    if(ctx.method === 'GET' && ctx.url.split('?')[0] === '/getData.jsonp'){
        //获取jsonp 的callback
        let callbackName = ctx.query.callback || 'callback'
        let returnData = {
            success:true,
            data:{
                text:'this is a jsonp api',
                time: new Date().getTime()
            }
        }

        //jsonp的script字符串
        let jsonpStr = `;${callbackName}(${JSON.stringify(returnData)})`

        //用text/javascript，让请求支持跨域支持
        ctx.type = 'text/javascript'

        //输出jsonp字符串
        ctx.body = jsonpStr
    }else{
        ctx.body = 'hello jsonp'
    }

})
app.listen(3000)

koa-jsonp中间件

 const Koa =require('koa2')
const jsonp = require('koa-jsonp')
const app = new Koa()

//使用中间件
app.use(jsonp())

app.use(async ctx=>{
    let returnData = {
        success: true,
        data:{
            text:'this si a jsonp api',
            time: new Date().getTime
        }
    }

    //直接输出JSON
    ctx.body = returnData
})

app.listen(3000)