c ajax跨域获取json,ajax跨域之jsonp

跨域之jsonp

jsonp跨域原理

script便签能够跨域，基于这个机制，能够在A域的页面中定义jsonp函数，script标签返回这个函数的调用javascript

以下代码所示

A域页面代码html

正在获取数据……

function jsonp(data) {

document.querySelector('div').innerHTML = data;

}

B域服务器代码java

const Koa = require('koa')

const bodyParser = require('koa-bodyparser')

const app = new Koa()

const util = require('./util')

// bodyParser 插件，处理 post 提交过来的数据

app.use(bodyParser())

app.use(async ctx => {

const url = ctx.url

util.log(`访问地址：${url}；请求方法：${ctx.method}`)

if (url.indexOf('/data.js') === 0) { // 首页

ctx.set('Content-Type', 'application/x-javascript')

ctx.body = `${ctx.query.callback || 'jsonp'}("哈哈哈哈，JSONP 能够的！")`//返回方法的调用

} else {

ctx.status = 404

ctx.body = '404'

}

})

app.listen(3000, () => {

util.log('服务启动，打开 http://127.0.0.1:3000/')

})

结果以下：

ajax