资讯专栏INFORMATION COLUMN

JSONP与跨域的Ajax

jeyhan / 3237人阅读

摘要:在通常情况下,为了网站的安全性,对象只能访问到与当前页面位于同一个域下的资源。由两部分组成,一部分是回调函数,一部分是所包含的数据。回调函数是请求数据时指定,而数据则是跨域资源返回的数据。

在通常情况下,为了网站的安全性,Ajax对象只能访问到与当前页面位于同一个域下的资源。但有时往往需要访问别的域中的资源,这是就运用到了跨域这个概念,这其中运用最广泛的就是JSONP。
JSONP,即JSON with padding(填充式的JSON)。JSON由两部分组成,一部分是回调函数,一部分是所包含的数据。回调函数是请求数据时指定,而数据则是跨域资源返回的JSON数据。
要实现使用JSONP跨域需要三步:
第一步,动态创建一个script元素;
第二步,设置script元素的src为想要跨域请求资源的url,这个url的参数callback为请求到资源后的处理函数;
第三步,定义处理函数,处理返回的对象;
第四步,把script元素添加到页面中

var scriptEl = document.createElement("script");
scriptEl.src = "http://www.freegeoip.net/json/?callback=handleResponse";
document.body.appendChild(scriptEl);
function handleResponse(response) {
  /*response的类型是Object*/
  alert(response.country_name);
}

但是JSONP也并不是完美的,主要有两个缺点:
一、由于请求的是其他域中的资源,很有可能这个资源不安全,造成网站的损失。
二、不容易确定资源是否请求成功。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/81660.html

相关文章

  • web安全一,同源策略跨域

    摘要:可以说同源策略在安全中扮演着及其重要的角色。我把这个领域的东西写成了一个系列,以后还会继续完善下去安全一同源策略与跨域安全二攻击安全三攻击 之所以要将同源策略与跨域写在一起,是因为存在浏览器的同源策略,才会存在跨域问题 何为同源策略 同源策略是浏览器实现的一种安全策略,它限制了不同源之间的文档和脚本交互的权限。只有同一个源的脚本才会具有操作dom、读写cookie、session 、a...

    cgspine 评论0 收藏0
  • 同源策略跨域资源共享的纠缠

    摘要:扯了这么多,自然不是为了吹水,而是要为了引出前端开发的一个重要的知识点同源策略什么是同源策略出于保护用户信息安全的目的,现在的浏览器都会实施同源策略这个政策,所谓同源策略指的是不同源的客户端脚本在没有明确授权情况下,不允许读写对方的资源。 导语你家的小孩带了他的朋友来你们的家里玩,你家的小孩如果要在自家屋里拿玩具玩、拿东西吃你自然是不会阻止,但是如果你家小孩的朋友人品不行,乱拿东西吃、...

    alighters 评论0 收藏0
  • 同源策略跨域资源共享的纠缠

    摘要:扯了这么多,自然不是为了吹水,而是要为了引出前端开发的一个重要的知识点同源策略什么是同源策略出于保护用户信息安全的目的,现在的浏览器都会实施同源策略这个政策,所谓同源策略指的是不同源的客户端脚本在没有明确授权情况下,不允许读写对方的资源。 导语你家的小孩带了他的朋友来你们的家里玩,你家的小孩如果要在自家屋里拿玩具玩、拿东西吃你自然是不会阻止,但是如果你家小孩的朋友人品不行,乱拿东西吃、...

    赵连江 评论0 收藏0
  • ajax跨域,这应该是最全的解决方案了

    摘要:关于,强烈推荐阅读跨域资源共享详解阮一峰另外,这里也整理了一个实现原理图简化版如何判断是否是简单请求浏览器将请求分成两类简单请求和非简单请求。 前言 从刚接触前端开发起,跨域这个词就一直以很高的频率在身边重复出现,一直到现在,已经调试过N个跨域相关的问题了,16年时也整理过一篇相关文章,但是感觉还是差了点什么,于是现在重新梳理了一下。 个人见识有限,如有差错,请多多见谅,欢迎提出iss...

    ytwman 评论0 收藏0
  • Web开发之跨域跨域资源共享

    摘要:例外当涉及到同源策略时,有两个主要的例外授信范围两个相互之间高度互信的域名,如公司域名,不遵守同源策略的限制。端口未将端口号加入到同源策略的组成部分之中,因此和属于同源并且不受任何限制。 原文链接:http://www.devsai.com/2016/11/24/talk-CORS/ 同源策略(same origin policy) 1995年,同源政策由 Netscape 公司引入浏...

    Eastboat 评论0 收藏0

发表评论

0条评论

jeyhan

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<