首页 > 网站 > WEB开发 > 正文

记一次Ajax的跨站访问

2024-04-27 14:22:42
字体:
来源:转载
供稿:网友

记一次Ajax的跨站访问

近期,好久没更新博客了,好像开始赖起来了(有点觉得博客园的不支持markdown)

自从上次面试以来,被问起Ajax怎么进行跨域访问没有答上来后,就像试试这个高大上的功能是怎么实现的呢,百度了一下好像也不是那么难

在通常情况下,Ajax是不能跨站访问的,必须要遵守同源策略(same origin policy).但是现在有了JSONP(JSON with Padding),它用<script>标签来包装自己在不同的站点之间穿梭。

为什么要特别强调跨站访问这个问题,还是要说回安全性上来:

--假如我点了一个有恶意脚本的链接(有可能藏在图片里面),这个脚本把我带进银行的某一个更改个人信息的页面。同时有可能我有这个银行的cookie,导致有可能就直接完成了

完成这个功能要两方面来进行协商,就是说服务器端必须知道并且配合客户端的跨站点访问请求。

client-side:

$.getJSON(<要请求的url>?callback=?, function(data){    //这里的callback=?,并不是真的传?过去,jquery会自己生成一串随机值替换这个?的     data=eval(data)                                                                   //这里就可以对收到的数据转化成object格式了     alert(data[1].title)                                                               //直接按属性访问 });

server-side:

先要收到callback传来的值,这里记作jsonp(类似的格式可能是这样”jsonp47981231933”)

再来准备返回数据了,比如要返回的数据类似于[{“id”:1,”title”:”aa”},{“id”:2,”title”:”bb”}]

那么要配合一个跨站访问,必须要对原有返回数据进行一次包装成:

jsonp([{“id”:1,”title”:”aa”},{“id”:2,”title”:”bb”}])

Note: 上面的callback是可以自己换成其他名字的,我感觉这个属性像是一个密钥一样,只有知道服务器端到底接受什么名字的密钥才能进行通信

$.getJSON(<要请求的url>?anything=?, function(data){      data=eval(data)                                                                        alert(data[1].title)                                                                });


发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表