美文网首页
ES6解决跨域

ES6解决跨域

作者: 连朋伟 | 来源:发表于2019-02-27 17:12 被阅读0次

实现一个jsonp函数,仅需要支持jsonp(url)一种调用方式即可(仅有url一个传参),例如: jsonp('//t.alicdn.com/t/gettime?callback=cb').then(result=>console.dir(result))

//需使用promise
function jsonp(url) {
//在这里书写代码
    return new Promise((resolve, reject) => {
        let callbackName = `${url.split("?")[1].split("=")[1]}${Date.now()}`
        url = url.split("?")[0] + `?${url.split("?")[1]}${Date.now()}`
        let script = document.createElement('script')
        script.src = url
        window[callbackName] = (res) => {
            delete window[callbackName]
            document.body.removeChild(script)
            if (res) {
                resolve(res)
            } else {
                reject('没有返回数据')
            }
        }
        script.addEventListener('error', () => {
            delete window[callbackName]
            document.body.removeChild(script)
            reject('script资源加载失败')
        }, false)
        document.getElementsByTagName("body")[0].appendChild(script)
    })
}
//调用
jsonp('//t.alicdn.com/t/gettime?callback=cb').then(result=>console.dir(result))

相关文章

  • axios + vue-cli 解决跨域问题 &&am

    跨域解决的方法 使用代理,说到代理就想到es6中的代理proxy,这里说的是接口跨域的 vue proxyTabl...

  • 浏览器跨域的那些事

    整理中 目标: 了解跨域 解决跨域 服务器配置跨域(java, nginx) 前端调试时配置解决跨域 一、什么是跨...

  • 解决ajax跨域问题

    Jsonp解决ajax跨域问题 CORS解决ajax跨域问题

  • 浏览器跨域及其解决方案

    title: 浏览器跨域及其解决方案author: Maydate: 20220428 什么是跨域跨域的表现解决跨...

  • ajax readystatus=0;status=0 报错

    跨域 跨域 跨域 一定要找运维或者后台解决

  • 跨域解决方案

    在讲解决跨域解决方案之前,我们需要了解什么是跨域,在什么情况下会跨域,跨域解决的是什么问题? 一、跨域,是指浏览器...

  • 跨域

    什么是跨域?怎么解决跨域问题?

  • 深入跨域问题(3) - 利用 JSONP 解决跨域

    深入跨域问题(1) - 初识 CORS 跨域资源共享;深入跨域问题(2) - 利用 CORS 解决跨域深入跨域问题...

  • ES6解决跨域

    实现一个jsonp函数,仅需要支持jsonp(url)一种调用方式即可(仅有url一个传参),例如: jsonp(...

  • 跨域

    跨域资源共享 CORS 详解什么是跨域及怎么解决跨域问题?

网友评论

      本文标题:ES6解决跨域

      本文链接:https://www.haomeiwen.com/subject/xewfuqtx.html