AJAX跨域与JSONP的一点实践经验
前几个周,项目中遇到了AJAX跨域的问题,然后找资料解决了。
首先要说明一点,关于AJAX的跨域原理和实践,我的经验还是比较少的,我只是大致看了下网上的资料,结合自己的理解,找到了解决办法,暂时不去仔细研究,因为要做的事情太多了,不可能把所有的问题都给研究透彻了。
问题场景:
a.com访问二级域名cms.a.com上的AJAX请求,遇到了跨域问题,Chrome-Firefox都没有问题,IE7-8-9都没有数据,直接报错了。貌似AJAX跨域不同浏览器的机制不一样。
网上有提到一种叫“JSONP”的技术,大概的意思是,我们可以直接修改<script src=""></script>的src属性,从而绕过AJAX跨域这个限制。
$.getJSON("http://cms.a.com/post/recentpost.json?jsoncallback=?",{count:count,categoryid:categoryid}, function(data){
getJSON是jquery提供的API,专门用来获得JSON格式的数据,貌似是JSONP原理实现,尚未研究。
大致的思路是,在向后端发送请求的时候,多发送一个参数,即回调函数的名字,我自己取的名字是jsoncallback,后台响应方式:
返回的格式是,myCallback({a:1,b:2}) ,myCallback是回调函数的值。
后端那个响应方法有点局限,应该需要做下判断,如果前端传入了jsoncallbak就按照jsonp的方式返回,如果是正常是非跨域AJAX请求,没有callback参数,就返回另外一种格式的数据。
参考资料:
http://blog.csdn.net/hemingwang0902/article/details/4811064
http://www.cnblogs.com/dowinning/archive/2012/04/19/json-jsonp-jquery.html
http://www.cnblogs.com/IT-Cristian/archive/2010/01/28/1658363.html
http://blog.jobbole.com/53487/
AJAX跨域与JSONP的一点实践经验的更多相关文章
- Ajax跨域:Jsonp实例--百度搜索框下拉提示
Ajax跨域:Jsonp实例--百度搜索框下拉提示 一.总结 一句话总结:a.找好接口:b.用script标签的src引入文件(json数据):c.定义及实现上一步引入文件中的函数 1.如何找到一个网 ...
- Ajax跨域:Jsonp原理解析
推荐先看下这篇文章:JS跨域(ajax跨域.iframe跨域)解决方法及原理详解(jsonp) JavaScript是一种在Web开发中经常使用的前端动态脚本技术.在JavaScript中,有一个很重 ...
- 【JS跨域请求】Ajax跨域请求JSONP
前两天被问到ajax跨域如何解决,还真被问住了,光知道有个什么jsonp,迷迷糊糊的没有说上来.抱着有问题必须解决的态度,我看了许多资料,原来如此... 为何一直知道jsonp,但一直迷迷糊糊的不明白 ...
- JQuery实现Ajax跨域访问--Jsonp原理
JavaScript是一种在Web开发中经常使用的前端动态脚本技术.在JavaScript中,有一个很重要的安全性限制,被称为“Same-Origin Policy”(同源策略).这一策略对于Java ...
- ajax跨域请求のJSONP
简单说了一下,JSON是一种基于文本的数据交换方式,或者叫做数据描述格式. JSON的优点: 1.基于纯文本,跨平台传递极其简单: 2.Javascript原生支持,后台语言几乎全部支持: 3.轻量级 ...
- 【记录】ajax跨域问题jsonp正确的使用方式
最近遇到ajax请求跨域问题,解决方案用jsonp,现记录如下: //跨域请求jsonp封装 function doJsonPostCallBack(type, url, data,async, ca ...
- AJAX 跨域请求 - JSONP获取JSON数据
Asynchronous JavaScript and XML (Ajax ) 是驱动新一代 Web 站点(流行术语为 Web 2.0 站点)的关键技术.Ajax 允许在不干扰 Web 应用程序的显示 ...
- 【转】AJAX 跨域请求 - JSONP获取JSON数据
来源:http://justcoding.iteye.com/blog/1366102/ Asynchronous JavaScript and XML (Ajax ) 是驱动新一代 Web 站点(流 ...
- Ajax跨域:jsonp还是CORS
跨域一般用jsonp,兼容性比较好.CORS是html5最新的XHR第二版本,不支持IE8,IE9,对移动端的支持非常好.但是考虑项目后期这部分会转到同域名下,而且网址不需要支持ie8,ie9,所以我 ...
随机推荐
- 硬件——STM32,ADC篇
未完,待续...... 也就是stm32f10X系列的adc采集出来的结果是12位的 stm32f10X系列有两个16位adc 关于程序的编写方法:一般 “某某.c文件”:都是用来设置“某某”的一些 ...
- 双向链表(自己写的c++类)
UVA还是上不去T T哭瞎了. 只好老老实实的研究上回买的书了. 写得有点长.好吧,我只是来复习C++类的. 特意用class 而不用struct写链表. 数据结构还没学...双向链表就当先预习了. ...
- springboot 使用FreeMarker模板(转)
在spring boot中使用FreeMarker模板非常简单方便,只需要简单几步就行: 1.引入依赖: <dependency> <groupId>org.springfra ...
- nginx启用https访问
什么是https? https 全称:Hyper Text Transfer Protocol over Secure Socket Layer,是http的安全版.即http下加入SSL协议层,因此 ...
- (转)Nginx在RedHat中系统服务配置脚本
转自:http://binyan17.iteye.com/blog/1688308 以下代码是在前人的基础上,结合自己服务器实际情况修改的,本人服务器环境是:CentOS 6.31.创建启动脚本, ...
- 一致哈希算法Java实现
一致哈希算法(Consistent Hashing Algorithms)是一个分布式系统中经常使用的算法. 传统的Hash算法当槽位(Slot)增减时,面临全部数据又一次部署的问题.而一致哈希算法确 ...
- Android内存优化杂谈
Android内存优化是我们性能优化工作中比较重要的一环,这里其实主要包括两方面的工作: 优化RAM,即降低运行时内存.这里的目的是防止程序发生OOM异常,以及降低程序由于内存过大被LMK机制杀死的概 ...
- MySQL启动关闭添加到 /etc/init.d/mysqld
cp /data/mysql/support-files/mysql.server /etc/init.d/mysqld 然后就可以使用此命令启动/关闭 mysql: /etc/ini ...
- [Scss Flex] Reuse Flexbox Styles With A Sass Mixin
This lesson covers flexbox in a reusable mixin that should cover most layout situations on your site ...
- 50个SQL语句
一个项目用到的50个SQL语句 转载 说明:下面五十个语句都依照測试数据进行过測试.最好每次仅仅单独执行一个语句. 问题及描写叙述: --1.学生表 Student(Sid,Sname,Sage,Ss ...