jsonp(对,通俗易懂)
jsonp是啥玩意儿呢 ?你猜!
此感叹号意味着以下内容要说正事儿了!!!!!
由于浏览器为了安全限制(他要怎样他说了算,此处不扯远了):只能允许来自同服务器,同域名的同端口号下请求数据(同源),是的jsonp就是为了不受你限制而生的!
。》》。
。
。
。老子实在不想写了 ,但是看别人写的太鸡巴啰嗦了,借别人代码说两句,就一句,你可能就懂了
。
。
<!DOCTYPE html>
<html>
<head>
<title>GoJSONP</title>
</head>
<body>
<script type="text/javascript">
function jsonhandle(data){
alert("age:" + data.age + "name:" + data.name);
}
</script>
<script type="text/javascript" src="jquery-1.8.3.min.js">
</script>
<script type="text/javascript">
$(document).ready(function(){
$.ajax({
type : "get",
async: false,
url : "http://www.practice-zhao.com/student.php?id=1",
type: "json",
success : function(data) {
jsonhandle(data);
} });
});
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>GoJSONP</title>
</head>
<body>
<script type="text/javascript">
function jsonhandle(data){
alert("age:" + data.age + "name:" + data.name);
}
</script>
<script type="text/javascript" src="jquery-1.8.3.min.js">
</script>
<script type="text/javascript">
$(document).ready(function(){
var url = "http://www.practice-zhao.com/student.php?id=1&callback=jsonhandle";
var obj = $('<script><\/script>');
obj.attr("src",url);
$("body").append(obj);
});
</script>
</body>
</html>
http://www.practice-zhao.com/student.php?id=1&callback=jsonhandle 此地址是一个php的输出getInfo({"username":"张三"})
代码估计你们也看得懂,重点!!重点来了!!!!!!所谓跨域,就是数据共享,接口请求做限制,但是没有对图片,文本,文件等在是否同一来源(同服务器,同域名的同端口号)做限制,比如cdn(此处有人白眼),所以在script标签的src其实是个get请求,这个请求可以是一个js文件也可以是一个js代码!总之它不是一个被限制跨域的接口请求!说白了就是去拿到js代码,想要传的数据整合在这串代码里了(呵呵,早期的web端推送就是这样的原理,push一段代码过来)
mmmp 终于写完了,我就是有点懒
jsonp(对,通俗易懂)的更多相关文章
- 通俗易懂JSONP讲解
原文地址:http://www.cnblogs.com/dowinning/archive/2012/04/19/json-jsonp-jquery.html JSON的格式或者叫规则: JSON能够 ...
- 关于laravel框架的跨域请求/jsonp请求的理解
最近刚接触laravel框架,首先要写一个跨域的单点登录.被跨域的问题卡了两三天,主要是因为对跨域这快不了解,就在刚才有点茅塞顿开的感觉,我做一下大概整理,主要给一些刚接触摸不着头脑的看,哪里写得不对 ...
- 通用jsonp跨域技术获取天气数据
1. 前言 在进行网站开发的过程中经常会用到第三方的数据,但是由于同源策略的限制导致ajax不能发送请求,因此也无法获得数据.解决ajax的跨域问题可以使用jsonp技术 2.代码 <!DOCT ...
- 前端跨域问题,以及ajax,jsonp,json的区别
看了很多网上的资料,小七感觉都没有完全解决我的疑惑以及问题,所以特意拿出通俗易懂的话讲解跨域问题,以及ajax,jsonp,json的区别.首先先说跨域问题什么时候需要跨域?[1]域名不同(即网址不同 ...
- JSONP跨域的script标签请求为什么不受同源策略的限制?
在复习跨域的时候,复习到了JSONP跨域,大家都知道JSONP跨域是通过动态创建script标签,然后通过其src属性进行跨域请求的,前端需要一个数据处理的回调函数,而服务端需要配合执行回调函数,放入 ...
- 实例操作JSONP原理
絮语:按这个步骤走,你就会明白JSONP是什么鬼. 1.工程目录: ng-mywork demo.html test.js 2.nginx的server配置 server { listen ; ser ...
- angular2系列教程(九)Jsonp、URLSearchParams、中断选择数据流
大家好,今天我们要讲的是http模块的第二部分,主要学习ng2中Jsonp.URLSearchParams.observable中断选择数据流的用法. 例子
- 疯狂的JSONP
何为跨域?何为JSONP?JSONP技术能实现什么?是否有必要使用JSONP技术? 跨域 就是由于JavaScript同源策略的限制,使得a.com域名下的js无法操作b.com或c.a.com域名下 ...
- 通过扩展让ASP.NET Web API支持JSONP
同源策略(Same Origin Policy)的存在导致了"源"自A的脚本只能操作"同源"页面的DOM,"跨源"操作来源于B的页面将会被拒 ...
随机推荐
- echarts简单的折线图
加jar包 <script src="<%=path %>/js/echarts.min.js"></script> 首先 在jsp页面中 选好 ...
- Django继承AbstractUser新建UserInfor Model时出现fields.E304错误
错误详情: SystemCheckError: System check identified some issues: ERRORS:app01.UserInfo.groups: (fields.E ...
- HBase Master HA高可用
HMaster没有单点问题,HBase中可以启动多个HMaster,通过Zookeeper的Master Election机制保证总有一个Master运行. 所以这里要配置HBase高可用的话,只需要 ...
- Vue随笔记录
一.创建Vue步骤(VS Code) 1.全局安装 npm install -g vue-cli 2.新建项目 vue init webpack "project-n ...
- 区间dp(入门题)
区间dp:顾名思义就是在区间上进行动态规划,通过合并小区间求解一段区间上的最优解. 常见模板: for(int len=1;len<n;len++){//区间长度 for(int be=1;be ...
- XML Linq 学习笔记
XML如下: <?xml version="1.0" encoding="utf-8"?> <Dishes> <Dish> ...
- redis哨兵集群
Sentinel 哨兵 修改src下的sentinel.conf文件 , 配置端口 :port:随便 daemonize yes 配置主服务器的ip 和端口 我们把监听的端口修改成7000,并且 ...
- js实现接口隔离
昨天公司培训了接口隔离,简单说一下 接口隔离:类间的依赖关系应该建立在最小的接口上.接口隔离原则将非常庞大.臃肿的接口拆分成更小具体的接口,这样客户讲会只需要知道他们感兴趣的方法. 接口隔离原则的目的 ...
- 机器学习(四)--------逻辑回归(Logistic Regression)
逻辑回归(Logistic Regression) 线性回归用来预测,逻辑回归用来分类. 线性回归是拟合函数,逻辑回归是预测函数 逻辑回归就是分类. 分类问题用线性方程是不行的 线性方程拟合的是连 ...
- hbase-写操作
hbase连接过程 hbase client在写入的数据的过程中,是直接和rs进行通信的,整个的数据写入流程并不涉及到HMaster.那么client是如何找到对应的rs呢?流程如下: client从 ...