FLQ77的博客

正在自学的前端小白的博客

JSONP跨域

JSONP和JSON看起来差不多,只不过是被包含在函数调用中的JSON,就像下面一样。

callback({"age":15,"name":"Jack"})

JSONP由两部分组成:回调函数和数据。回调函数是当响应到来时应该在页面中调用的函数。回调函数的名字一般在请求中指定。而数据就是传如回调函数的中的JSON数据。
JSONP是通过动态添加<script>元素来使用的,使用时可以为src属性指定一个跨域URL。下面就是一个常见的请求:

https://flq77.github.io/jsonp.json?callback=handleJsonp

下面来看一个例子:

//回调函数
function handleJsonp(response) {
    alert("age:"+response.age+"name:"+response.name);
}
//动态创建一个<script>元素
function creatScript() {
      let script = document.createElement("script");
      script.src="https://flq77.github.io/jsonp.json?callback=handleJsonp";
    document.body.appendChild(script);
}

跨域文件flq77.github.io/jsonp.json中:

handleJsonp({
    "age":15,
    "name":"Jack"
})

浏览器显示:
这里写图片描述

阅读更多
版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/FLQ77/article/details/79948031
文章标签: JSONP 跨域
个人分类: 学习笔记----JS
上一篇JSON解析与序列化
下一篇选择符API
想对作者说点什么? 我来说一句

ajax jsonp 跨域处理

2013年02月26日 596KB 下载

没有更多推荐了,返回首页

关闭
关闭