跨域

class CrossDomain {
    static async cors (ctx) {
        const query = ctx.request.query
        // 如果需要http请求中带上cookie，需要前后端都设置credentials，且后端设置指定的origin
        ctx.set('Access-Control-Allow-Origin', 'http://localhost:9099')
        ctx.set('Access-Control-Allow-Credentials', true)
        // 非简单请求的CORS请求，会在正式通信之前，增加一次HTTP查询请求，称为"预检"请求（preflight）
        // 这种情况下除了设置origin，还需要设置Access-Control-Request-Method以及Access-Control-Request-Headers
        ctx.set('Access-Control-Request-Method', 'PUT,POST,GET,DELETE,OPTIONS')
        ctx.set('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept, t')
        ctx.cookies.set('tokenId', '2')

        ctx.body = successBody({msg: query.msg}, 'success')
    }
}
module.exports = CrossDomain

// 或者直接使用插件（koa2），来设置这些请求头：koa2-cors
app.use(cors({
    origin: function (ctx) {
        return 'http://host:9099'
    },
    credentials: true,
    allowMethods: ['GET', 'POST', 'DELETE'],
    allowHeaders: ['t', 'Content-Type']
}))

fetch(`http://somehost/api/v1/cors?msg=helloCors`, {
    // 需要带上cookie
    credentials: 'include',
    headers: {
        't': 'extra headers'
    }
}).then(res => {
    console.log(res);
});

// 后端（koa2）
class ApiController {
    static async jsonp (ctx) {

        const query = ctx.request.query;

        // 获取到的接口资源
        const data = { data: '123' };

        if (query.callback) {
            // 作为jsonp，返回执行回调函数脚本
            ctx.body = `${query.callback}(${JSON.stringify(data)})`;
        } else {
            // 作为普通接口，返回资源数据
            ctx.body = data;
        }
    }
}
module.exports = ApiController;

// 父窗口的服务模块

const requestPost = ({ url, method, data }) => {

    // 参数校验，若是 GET 可能需要拼接 data 为 query ，此处只默认处理 POST 情况

    // 首先创建一个用来发送数据的iframe
    const iframe = document.createElement('iframe');
    iframe.src = ''; // 此处应填子页面的地址
    iframe.name = 'iframeCrossDomain';
    iframe.style.display = 'none';
    document.body.appendChild(iframe);

    // 创建 form 标签以及 负责准备数据的input
    let form = document.createElement('form');
    let input = document.createElement('input');
    form.style.display = 'none';

    form.action = url;
    // 指定 form 的 target 为一个新生成的 iframe
    form.target = iframe.name;
    form.method = method;
    // 此处为 POST 请求包装参数
    for (let name in data) {
        input.name = name;
        input.value = data[name].toString();
        form.appendChild(input.cloneNode());
    }

    // 表单元素需要添加到主文档中.
    document.body.appendChild(form);
    form.submit();

    // GC
    let GC = () => {
        document.body.removeChild(form);
        document.body.removeChild(iframe);
        GC = form = input = null;
    }

    return new Promise((resolve, reject) => {
        // 注册iframe的load事件，将拿到的请求返回抛出
        window.addEventListener('message', e => {
            const event = e || window.event;
            const res = event.data || {};
            resolve(res);
            GC();
        });
    });
}

// 使用方式
requestPost({
    url: 'http://somehost/api/v1/someSource',
    method: 'POST',
    data: {
        msg: '123'
    }
}).then(res => {
    console.log(res);
});