其他相关内容：
跨域 - CORS跨域资源共享
浏览器同源策略
为了解决跨域请求，可以使用 form 表单提交和 CORS 跨域资源共享。但还有一些有 src 属性的 HTML标签也可以跨域访问资源，比如 img 和 script。
JSONP 就是利用 script 标签来实现跨域的。
当通过 script 标签发送请求时，服务器会响应一段 js 代码。这段代码是一个函数调用，函数需要在客户端定义好，服务器将响应数据作为参数传递即可。
客户端
<!DOCTYPE html>
<html lang="en">
<body>
<script>
function callbackJSONP(data) {
console.log(data)
}
</script>
<script src="http://localhost:3000/api/list"></script>
</body>
</html>
服务端
var Koa = require('koa')
var Router = require('koa-router')
var app = new Koa()
var router = new Router()
router.get('/api/list', (ctx, next) => {
const result = {
code: 200,
total: 100,
data: [{ id: 1, name: '下雪天的夏风', want: '求关注' }]
}
// 非必须，只是告知客户端返回的内容的类型。
ctx.set('content-type', 'text/javascript')
ctx.body = `callbackJSONP(${JSON.stringify(result)})`
})
app.use(router.routes())
app.listen(3000)
<!DOCTYPE html>
<html lang="en">
<body>
<button id="btn">获取数据</button>
<script>
function callbackJSONP(data) {
console.log(data)
}
function jsonp(url) {
const script = document.createElement('script')
script.src = `${url}?callbackJSONP` // 告知服务端定义的函数名
script.onload = function () {
script.remove()
}
document.body.appendChild(script)
}
const btn = document.querySelector('#btn')
btn.addEventListener('click', function () {
jsonp('http://localhost:3000/api/list')
})
</script>
</body>
</html>
var Koa = require('koa')
var Router = require('koa-router')
var app = new Koa()
var router = new Router()
router.get('/api/list', (ctx, next) => {
const result = {
code: 200,
total: 100,
data: [{ id: 1, name: '下雪天的夏风', want: '求关注' }]
}
ctx.set('content-type', 'text/javascript')
ctx.body = `${ctx.querystring}(${JSON.stringify(result)})`
})
app.use(router.routes())
app.listen(3000)
以上。