function jsonp({url, params, callback}) {
      return new Promise((resolve, reject) => {
        let script = document.createElement('script')
        // callback 让服务器端调用,并且将数据传递进来
        window[callback] = function (data) {
          resolve(data)
          document.body.removeChild(script)
        }
        params = {...params, callback}
        const arr = []
        for (let key in params) {
          arr.push(`${key}=${params[key]}`)
        }
        script.src = `${url}?${arr.join('&')}`
        document.body.appendChild(script)
      })
    }

    function synchronize(urls) {
      return urls.map((url,i) => jsonp({url, params: {}, callback: 'show' + i}))
    }

      const ajurl = [
        'http://api.douban.com/v2/movie/in_theaters',
        'http://api.douban.com/v2/movie/top250'
      ]

      Promise.all(synchronize(ajurl))
        .then(result => {
          for (let val of result) {
            console.log(val)
          }
        })

JSONP 通用函数封装的更多相关文章

  1. ajax和jsonp的封装

    一直在用jQuery的ajax,跨域也是一直用的jQuery的jsonp,jQuery确实很方便,$.ajax({...})就可以搞定. 为了更好的理解ajax和jsonp,又重新看了下书,看了一些博 ...

  2. jsonp 简单封装

    import originJSONP from 'jsonp' // 引入 jsonp 模块 // 对外暴露方法 jsonp // 通常传给服务端的 url 地址带参数 设计目的是希望有纯净的 url ...

  3. 用Vue来实现音乐播放器(六):JSONP的封装

    在npm上下载jsonp的包 这个包的用法 传入的参数是地址加上地址参数的混合  但是想封装一个将地址和地址参数分别传入的jsonp方法 所以来封装一个 import originJSONP from ...

  4. jsonp promise 封装

    import originJsonp from 'jsonp' export default function jsonp(url, data, option) { url += (url.index ...

  5. jsonp promise封装

    npm 安装jsonp import originJSONP from 'jsonp' export default function jsonp(url, data, option){ url += ...

  6. jsonp封装

    //jsonp的封装函数 function jsonp(url,parmter,callback){ //创建script标签 var script=document.createElement('s ...

  7. 网络请求之jsonp封装

    首先介绍下jsonp原理 浏览器因为同源策略的限制,在不同源的服务器通过我们传统axios是不能直接用来请求数据的(忽略代理),而src标签则不受同源策略的影响,所以我们需要动态的创建带有src的标签 ...

  8. jsonp跨域封装

    一.什么是同源政策? 同源策略是指在Web浏览器中,允许某个网页脚本访问另一个网页的数据,但前提是这两个网页必须有相同的URI.主机名和端口号,一旦两个网站满足上述条件,这两个网站就被认定为具有相同来 ...

  9. JSONP是如何工作的

    我对这个问题的探究来源于一个需求: 当访问某个页面的时候,需要向另外一个网站报告一下这次访问的信息. 其实发一个跨域的请求就能大致实现这个需求.我们发跨域的例子其实很常见,例如请求一个第三方的图片.引 ...

随机推荐

  1. linq(查询)

    1.改变数据库某一字段的属性 db.tableName.ToList().ForEach(x => x.State = false); 2.排序 db.tableName..toList().O ...

  2. Jquery系列:textarea常用操作

    1.textarea内容的读取与设置 读textarea文本值可以用name和id.而写入文本值只能用id. <textarea name="content" id=&quo ...

  3. mysql三-3:完整性约束

    一.完整性约束介绍 约束条件与数据类型的宽度一样,都是可选参数 作用:用于保证数据的完整性和一致性主要分为: PRIMARY KEY (PK) 标识该字段为该表的主键,可以唯一的标识记录 FOREIG ...

  4. webstorm 配置Vue.js 语法提示

    标签属性 v-text v-html v-once v-if v-show v-else v-for v-on v-bind v-model v-ref v-el v-pre v-cloak v-on ...

  5. Struts2项目问题及解决方式

    1.  问题描述如图: 问题解释:意思就是execute()方法写错了. 问题解决: 改正:

  6. linux 安装和卸载软件

    安装: apt-get install cups-pdf 卸载:apt -get remove cups

  7. Azure 9 月新发布

    亲爱的小伙伴们, 我们很高兴向您宣布以下新功能与相关调整,欢迎关注与使用. 1. SQL 数据库弹性池  2. 存储指标更新 3. SQL 数据库 P15 4. Azure 高级存储 5. Wosig ...

  8. Flask入门request session cookie(二)

    1 HTTP方法分类 1 GET 浏览器告知服务器:只获取页面上的信息并发给我.这是最常用的方法. 2 HEAD 浏览器告诉服务器:欲获取信息,但是只关心消息头 .应用应像处理 GET 请求一样来处理 ...

  9. iBrand 开源电商小程序 (Laravel API+ webpack + gulp + 原生小程序)

    iBrand 社交电商产品正式进入开源过程中了,我们制定了详细的开源计划,目前已经发布了 V1 的版本,后续的版本也在陆续整理完善中. 各个版本功能明细如下图: 3 个版本计划在今年春节前全部完成,可 ...

  10. php 四种基本排序算法

    冒泡排序 思路分析:法如其名,就是像冒泡一样,每次从数组当中 冒一个最大的数出来. 第一轮:从第一个到最后一个冒泡比较,运行结果:最后一个最大 第二轮:从第一个到倒数第二个冒泡比较, 运行结果:最后一 ...