`
乱蓬头199303
  • 浏览: 81718 次
文章分类
社区版块
存档分类
最新评论

ajax 和jsonp 不是一码事 细读详解

阅读更多
摘要: 由于Sencha Touch 2这种开发模式的特性,基本决定了它原生的数据交互行为几乎只能通过AJAX来实现。当然了,通过调用强大的PhoneGap插件然后打包,你可以实现100%的Socket通讯和本地数据库功能,又或者通过HTML5的WebSocket也可以实现与服务器的通讯和服务端推功能,但这两种方式都有其局限性,前者需要PhoneGap支持,后者要求用户设备必须支持WebSocket,因此都不能算是ST2的原生解决方案,原生的只有AJAX。

由于Sencha Touch 2这种开发模式的特性,基本决定了它原生的数据交互行为几乎只能通过AJAX来实现。当然了,通过调用强大的PhoneGap插件然后打包,你可以实现100%的Socket通讯和本地数据库功能,又或者通过HTML5的WebSocket也可以实现与服务器的通讯和服务端推功能,但这两种方式都有其局限性,前者需要PhoneGap支持,后者要求用户设备必须支持WebSocket,因此都不能算是ST2的原生解决方案,原生的只有AJAX。

说到AJAX就会不可避免的面临两个问题,第一个是AJAX以何种格式来交换数据?第二个是跨域的需求如何解决?这两个问题目前都有不同的解决方案,比如数据可以用自定义字符串或者用XML来描述,跨域可以通过服务器端代理来解决。但到目前为止最被推崇或者说首选的方案还是用JSON来传数据,靠JSONP来跨域。而这就是本文将要讲述的内容。

JSON和JSONP虽然只有一个字母的差别,但其实他们根本不是一回事儿:JSON是一种数据交换格式,而JSONP是一种依靠开发人员的聪明才智创造出的一种非官方跨域数据交互协议。我们拿最近比较火的谍战片来打个比方,JSON是地下党们用来书写和交换情报的“暗号”,而JSONP则是把用暗号书写的情报传递给自己同志时使用的接头方式。看到没?一个是描述信息的格式,一个是信息传递双方约定的方法。

既然随便聊聊,那我们就不再采用教条的方式来讲述,而是把关注重心放在帮助开发人员理解是否应当选择使用以及如何使用上。小小的广告一下,该篇文章是在自己群里与Sencha Touch 2的开发者们一起探讨ST2数据交互模型时有感而发写出来的,因此如果您对Mobile Web App开发有兴趣的话,欢迎加入Sencha Touch 交流 QQ 群 213119459 。

什么是JSON?

前面简单说了一下,JSON是一种基于文本的数据交换方式,或者叫做数据描述格式,你是否该选用他首先肯定要关注它所拥有的优点。

JSON的优点:
1、基于纯文本,跨平台传递极其简单;
2、JavaScript原生支持,后台语言几乎全部支持;
3、轻量级数据格式,占用字符数量极少,特别适合互联网传递;
4、可读性较强,虽然比不上XML那么一目了然,但在合理的依次缩进之后还是很容易识别的;
5、容易编写和解析,当然前提是你要知道数据结构;
JSON的缺点当然也有,但在作者看来实在是无关紧要的东西,所以不再单独说明。

JSON的格式或者叫规则:
JSON能够以非常简单的方式来描述数据结构,XML能做的它都能做,因此在跨平台方面两者完全不分伯仲。
1、JSON只有两种数据类型描述符,大括号{}和方括号[],其余英文冒号:是映射符,英文逗号,是分隔符,英文双引号""是定义符。
2、大括号{}用来描述一组“不同类型的无序键值对集合”(每个键值对可以理解为OOP的属性描述),方括号[]用来描述一组“相同类型的有序数据集合”(可对应OOP的数组)。
3、上述两种集合中若有多个子项,则通过英文逗号,进行分隔。
4、键值对以英文冒号:进行分隔,并且建议键名都加上英文双引号"",以便于不同语言的解析。
5、JSON内部常用数据类型无非就是字符串、数字、布尔、日期、null 这么几个,字符串必须用双引号引起来,其余的都不用,日期类型比较特殊,这里就不展开讲述了,只是建议如果客户端没有按日期排序功能需求的话,那么把日期时间直接作为字符串传递就好,可以省去很多麻烦。

JSON实例:
复制代码
// 描述一个人

var person = {

"Name": "Bob", "Age": 32, "Company": "IBM", "Engineer": true
点击并拖拽以移动
}

// 获取这个人的信息

var personAge = person.Age;

// 描述几个人

var members = [

​​​​​​​

原文链接http://click.aliyun.com/m/23944/
分享到:
评论

相关推荐

    Ajax结合Jsonp实例

    总结起来,Ajax与Jsonp的结合使用能够让我们在Jquery中轻松地实现跨域数据交互,从而提升Web应用的功能性和用户体验。在实际开发中,需要注意处理可能出现的错误情况,以及合理设计API接口的调用,以保证应用的稳定...

    Jquery与ajax用JSONP方式获取新浪短网址

    在本案例中,我们将探讨如何使用Jquery和ajax通过JSONP方式来调用新浪的API,将长网址转换为新浪的短网址。 首先,我们需要了解JSONP的工作原理。JSONP的基本思路是服务器提供一个JavaScript函数,这个函数接收JSON...

    Jsonp 关键字详解及json和jsonp的区别,ajax和jsonp的区别.docx

    ### Jsonp 关键字详解及json和jsonp的区别,ajax和jsonp的区别 #### 一、Jsonp 关键字详解 Jsonp(JSON with Padding)是一种跨域数据交互协议,它允许在一个网页中请求并获取另一个域的服务端数据。Jsonp 的工作...

    ajax跨域请求jsonp前后台代码

    基于ajax方式的跨域请求jsonp的前后台代码

    html通过 ajax jsonp跨域请求接收和传送数据

    **AJAX和JSONP跨域请求的实现过程** 1. **AJAX跨域**: 通常,AJAX请求受到同源策略限制。为实现跨域,我们可以使用CORS(Cross-Origin Resource Sharing)机制。服务器需要在响应头中添加`Access-Control-Allow-...

    全面解析Ajax和jsonp使用总结

    - Ajax和jsonp都是浏览器的API,不是JavaScript语言的一部分。这意味着它们只能在浏览器环境中使用,不能在Node.js等服务器端环境中使用。 总结来说,Ajax和jsonp是Web前端开发中实现异步数据请求不可或缺的技术。...

    Jsonp 关键字详解及json和jsonp的区别,ajax和jsonp的区别

    于是乎活动页面做完了,以后也没有碰到过jsonp,在这期间我一直以为jsonp跟ajax息息相关,是xhr的一种特殊的跨域形式…直到一个月前的一次面试,问到jsonp我被虐成狗,才决定看下jsonp,好吧,原来jsonp也不是很难。...

    PHP AJAX JSONP实现跨域请求使用范例_ajax如何解决跨域请求

    在这个实例中,我们使用 jQuery 的.ajax() 方法来发送 POST 请求,并指定 dataType 为 jsonp,以便使用 JSONP。 ```javascript $.ajax({ type: "post", url: "ajax.php", dataType: "jsonp", jsonp: "callback...

    java版 解决跨域问题CORS ajax+jsonp例子源代码.zip

    标题中的“java版 解决跨域问题CORS ajax+jsonp例子源代码.zip”指的是一个Java Web应用程序,它演示了如何处理跨域问题,主要通过两种方法:CORS(跨源资源共享)和JSONP(JSON with Padding)。这个压缩包包含了...

    ajaxjsonp.js

    jQuery跨域访问,封装的ajax 代码,我使用的jQuery版本是1.11.3

    ajax的js,jq jsonp,的请求方式

    **Ajax技术** Ajax,全称为Asynchronous JavaScript and XML...总结,Ajax、jQuery、JavaScript和JSONP都是Web开发中用于提升用户体验和数据交互的重要工具。理解并熟练运用它们,可以极大地优化网站性能和交互设计。

    AJAX jsonp应用,页面配置以及后台代码

    本教程将详细介绍AJAX如何与JSONP结合使用,以及在前端和后端实现JSONP的具体步骤。 ### JSONP原理 由于浏览器的同源策略,JavaScript通常无法直接获取不同源的数据。而`<script>`标签没有这个限制,因此JSONP通过...

    关于jQuery.ajax()的jsonp碰上post详解

    总结来说,$.ajax()结合JSONP和POST提供了强大的跨域请求能力,但它也引入了额外的安全考量,需要在实际应用中仔细设计和维护。通过理解跨域请求的工作原理和JSONP实现方式,开发者可以更加灵活地解决前端开发中的...

    Ajax跨域请求解决方案-JSONP

    然而,Ajax技术在实现动态网页交互时常常需要跨越这个限制,这时就引入了JSONP(JSON with Padding)作为跨域请求的一种解决方案。本文将详细介绍JSONP的工作原理以及如何在ASP.NET网站开发中应用JSONP解决Ajax跨域...

    ajax jsonp 跨域处理

    **Ajax JSONP 跨域处理详解** 在Web开发中,由于浏览器的安全策略限制,JavaScript通常不能直接访问不同源(协议、域名或端口不同)的资源,这就是所谓的“同源策略”。然而,随着Web应用的发展,跨域数据交互的...

    android html5 ajax jsonp json

    【描述】:“一个很全的Android实例,有很多demo”,这意味着这个压缩包中包含了多种实际操作的代码样例,帮助开发者理解并掌握如何在Android应用中运用HTML5、jQuery EasyUI、AJAX、JSONP和JSON。这些技术的结合...

    ajax和jsonp跨域的原理本质详解

    跨域问题是我们在开发中经常会遇到的一个需求,下面这篇文章主要给大家介绍了关于ajax和jsonp跨域的原理本质,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着...

    ajax jsonp跨域传参

    ajax jsonp跨域传参,里面有源码,不过写在txt中了,很适合调用别人的接口

Global site tag (gtag.js) - Google Analytics