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) } par…

一直在用jQuery的ajax,跨域也是一直用的jQuery的jsonp,jQuery确实很方便,$.ajax({...})就可以搞定. 为了更好的理解ajax和jsonp,又重新看了下书,看了一些博客,参照他们的代码封装了一个简单的库. 代码地址:http://files.cnblogs.com/zjzhome/ajax.js 使用方法和jQuery类似. 不跨域的话: Z.ajax('test.php', { data: { name: 'zjz', age: 10 }, dataType:…

import originJSONP from 'jsonp' // 引入 jsonp 模块 // 对外暴露方法 jsonp // 通常传给服务端的 url 地址带参数 设计目的是希望有纯净的 url 参数通过 data 拼在 url 上面 export default function jsonp(url, data, option) { // url 没有 '?' 时需要加 '?' url += (url.indexOf('?') < 0 ? '?' : '&') + param(dat…

在npm上下载jsonp的包 这个包的用法 传入的参数是地址加上地址参数的混合  但是想封装一个将地址和地址参数分别传入的jsonp方法 所以来封装一个 import originJSONP from 'jsonp' export default function jsonp(url,data,options){ url+=(url.indexOf('?')<0?'?':'&')+param(data) return new Promise((resolve,reject)=>{ or…

import originJsonp from 'jsonp' export default function jsonp(url, data, option) { url += (url.indexOf('?') < 0 ? '?' : '&') + param(data) return new Promise((resolve, reject) => { originJsonp(url, option, (err, data) => { if (!err) { resolve…

npm 安装jsonp import originJSONP from 'jsonp' export default function jsonp(url, data, option){ url += (url.indexOf('?') < 0 ? '?' : '&') + param(data) return new Promise((resolve, reject) => { originJSONP(url,option, (err, data)=>{ if (!err) {…

//jsonp的封装函数 function jsonp(url,parmter,callback){ //创建script标签 var script=document.createElement('script'); //拼接字符串 randomkey='cdf'+new Date().getTime(); //把拼接的字符串 变成全局变量 相当于callback函数的调用 window['randomkey']=callback; //把数字拼接到  src中 callback url='?c…

首先介绍下jsonp原理 浏览器因为同源策略的限制,在不同源的服务器通过我们传统axios是不能直接用来请求数据的(忽略代理),而src标签则不受同源策略的影响,所以我们需要动态的创建带有src的标签让其进行数据的请求,这就是jsonp的原理,在src的URL地址末尾拼接上一个回调函数,用来接受服务器传回来的数据 前端jsonp的封装展示 //封装一个jsonp请求的函数 function query(opt) { let str = "" for (let key in opt) {…

一.什么是同源政策? 同源策略是指在Web浏览器中,允许某个网页脚本访问另一个网页的数据,但前提是这两个网页必须有相同的URI.主机名和端口号,一旦两个网站满足上述条件,这两个网站就被认定为具有相同来源.此策略可防止某个网页上的恶意脚本通过该页面的文档对象模型访问另一网页上的敏感数据.同源策略对Web应用程序具有特殊意义,因为Web应用程序广泛依赖于HTTP cookie来维持用户会话,所以必须将不相关网站严格分隔,以防止丢失数据泄露.值得注意的是同源策略仅适用于脚本,这意味着某网站可以通过相应…

我对这个问题的探究来源于一个需求: 当访问某个页面的时候,需要向另外一个网站报告一下这次访问的信息. 其实发一个跨域的请求就能大致实现这个需求.我们发跨域的例子其实很常见,例如请求一个第三方的图片.引入一个第三方的样式文件.引入一个cdn上的js文件.然后,说到发送请求,在这个web2.0的时代,我们自然而然会想到Ajax请求.但是遗憾的是,考虑到安全问题,即所谓的同源安全策略,用ajax请求一个第三方的地址是被浏览器所禁止的.然而天无绝人之路,有个叫JSONP的技术就是来解决这种问题的. 说道…