跨域科普以及JSONP跨域方法

6 篇文章 0 订阅

首先科普一下域,这里只说前端的域。
前端的域是指服务器在网络上占据的地址。
跨域指的是浏览器请求了服务器A的某个页面,在操作该页面时,发送了一个请求B服务器的资源,这种现象就叫做跨域。

如何更详细的判定是否跨域呢?
当协议(http/https),端口或域名中有任何一个不同时,就视为跨域了。

为什么要进行跨域?
浏览器针对跨域设置了一个策略叫同源策略:原则上只允许请求同一个服务器的资源。注意,静态资源不受跨域限制,静态资源就是不会改变的资源,如图片,CSS文件,JS文件等。

利用JSONP进行跨域
jsonp跨域利用的是script标签无视同源策略并且还能执行代码的特定。需要注意的是,该方法需要接口返回的是一个函数的执行才可以。比如:
在这里插入图片描述
这里echo的就是一个函数的执行,callbackname是函数名。

具体的封装跨域函数代码如下:

 function jsonp(url, data, callback) {  参数分别是请求的域名,query和回调函数
     var str = "";
     for (var i in data) {
         str += i + "=" + data[i] + "&";
     }
     str = str.slice(0, -1);
     window[data.callbackname] = callback;          
     var script = document.createElement("script");
     script.src = url +"?"+str;
     document.body.appendChild(script);
     script.onload = function(){
         script.remove()
         delete window[data.callbackname];
     }
 }
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值