JS实现jsonp

jsonp原理是通过script标签从服务端加载一段js代码，这段js代码执行挂载在window对象上的全局函数window[callbackName]

function jsonp(url, data, callbackName) {
    // 如果没有传callbackName，就随机生成一个
    callbackName = callbackName || 'jsonp' + Math.random().toString().substr(2, 6)
    return new Promise((resolve, reject) => {
        // 1.创建script标签
        let script = document.createElement('script')

        // 2.拼接get请求的url
        let paramsArr = []
        data = data || {}
        for (let key in data) {
            paramsArr.push(`${key}=${data[key]}`)
        }
        paramsArr.push(`callback=${callbackName}`)
        script.src = `${url}?${paramsArr.join('&')}`

        // 3.挂载全局函数
        window[callbackName] = function (callbackData) {
            resolve(callbackData)
            // 删除script节点
            document.body.removeChild(script)
        }

        // 4.发送jsonp请求
        document.body.appendChild(script)

        script.onerror = function (err) {
            reject(err)
        }
    })
}

// 服务端返回 `callbackName([1,2,3])` 这样的js代码即可
// res.send(`${callback}(${JSON.stringify(data)})`)