`

ajax 技术和原理分析

    博客分类:
  • ajax
阅读更多

大家都知道ajax并非一种新的技术,而是几种原有技术的结合体。它由下列技术组合而成。

 

ajax所包含的技术
大家都知道ajax并非一种新的技术,而是几种原有技术的结合体。它由下列技术组合而成。
1.使用CSS和XHTML来表示。
2. 使用DOM模型来交互和动态显示。
3.使用XMLHttpRequest来和服务器进行异步通信。
4.使用javascript来绑定和调用。

在上面几中技术中,除了XmlHttpRequest对象以外,其它所有的技术都是基于web标准并且已经得到了广泛使用的,XMLHttpRequest虽然目前还没有被W3C所采纳,但是它已经是一个事实的标准,因为目前几乎所有的主流浏览器都支持它。

 

ajax原理和XmlHttpRequest对象

Ajax的原理简单来说通过XmlHttpRequest对象来向服务器发异步请求,从服务器获得数据,然后用javascript来操作DOM而更新页面。这其中最关键的一步就是从服务器获得请求数据。要清楚这个过程和原理,我们必须对 XMLHttpRequest有所了解。
XMLHttpRequest是ajax的核心机制,它是在IE5中首先引入的,是一种支持异步请求的技术。简单的说,也就是javascript可以及时向服务器提出请求和处理响应,而不阻塞用户。达到无刷新的效果。
所以我们先从XMLHttpRequest讲起,来看看它的工作原理。
首先,我们先来看看XMLHttpRequest这个对象的属性。
它的属性有:
onreadystatechange 每次状态改变所触发事件的事件处理程序。
responseText 从服务器进程返回数据的字符串形式。
responseXML 从服务器进程返回的DOM兼容的文档数据对象。
status 从服务器返回的数字代码,比如常见的404(未找到)和200(已就绪)
status Text 伴随状态码的字符串信息
readyState 对象状态值
0 (未初始化) 对象已建立,但是尚未初始化(尚未调用open方法)
1 (初始化) 对象已建立,尚未调用send方法
2 (发送数据) send方法已调用,但是当前的状态及http头未知
3 (数据传送中) 已接收部分数据,因为响应及http头不全,这时通过responseBody和responseText获取部分数据会出现错误,

4 (完成) 数据接收完毕,此时可以通过通过responseXml和responseText获取完整的回应数据。

 

ajax的优点
Ajax的给我们带来的好处大家基本上都深有体会,在这里我只简单的讲几点:
1、最大的一点是页面无刷新,在页面内与服务器通信,给用户的体验非常好。
  2、使用异步方式与服务器通信,不需要打断用户的操作,具有更加迅速的响应能力。
  3、可以把以前一些服务器负担的工作转嫁到客户端,利用客户端闲置的能力来处理,减轻服务器和带宽的负担,节约空间和宽带租用成本。并且减轻服务器的负担,ajax的原则是“按需取数据”,可以最大程度的减少冗余请求,和响应对服务器造成的负担。

4、基于标准化的并被广泛支持的技术,不需要下载插件或者小程序。

 

ajax的缺点
下面我着重讲一讲ajax的缺陷,因为平时我们大多注意的都是ajax给我们所带来的好处诸如用户体验的提升。而对ajax所带来的缺陷有所忽视。
下面所阐述的ajax的缺陷都是它先天所产生的。
1、ajax干掉了back按钮,即对浏览器后退机制的破坏。后退按钮是一个标准的web站点的重要功能,但是它没法和js进行很好的合作。这是ajax所带来的一个比较严重的问题,因为用户往往是希望能够通过后退来取消前一次操作的。那么对于这个问题有没有办法?答案是肯定的,用过Gmail的知道,Gmail下面采用的ajax技术解决了这个问题,在Gmail下面是可以后退的,但是,它也并不能改变ajax的机制,它只是采用的一个比较笨但是有效的办法,即用户单击后退按钮访问历史记录时,通过创建或使用一个隐藏的IFRAME来重现页面上的变更。(例如,当用户在Google Maps中单击后退时,它在一个隐藏的IFRAME中进行搜索,然后将搜索结果反映到Ajax元素上,以便将应用程序状态恢复到当时的状态。)
但是,虽然说这个问题是可以解决的,但是它所带来的开发成本是非常高的,和ajax框架所要求的快速开发是相背离的。这是ajax所带来的一个非常严重的问题。
2、安全问题
技术同时也对IT企业带来了新的安全威胁,ajax技术就如同对企业数据建立了一个直接通道。这使得开发者在不经意间会暴露比以前更多的数据和服务器逻辑。ajax的逻辑可以对客户端的安全扫描技术隐藏起来,允许黑客从远端服务器上建立新的攻击。还有ajax也难以避免一些已知的安全弱点,诸如跨站点脚步攻击、SQL注入攻击和基于credentials的安全漏洞等。
3、对搜索引擎的支持比较弱。
4、破坏了程序的异常机制。至少从目前看来,像ajax.dll,ajaxpro.dll这些ajax框架是会破坏程序的异常机制的。关于这个问题,我曾经在开发过程中遇到过,但是查了一下网上几乎没有相关的介绍。后来我自己做了一次试验,分别采用ajax和传统的form提交的模式来删除一条数据……给我们的调试带来了很大的困难。
5、另外,像其他方面的一些问题,比如说违背了url和资源定位的初衷。例如,我给你一个url地址,如果采用了ajax技术,也许你在该url地址下面看到的和我在这个url地址下看到的内容是不同的。这个和资源定位的初衷是相背离的。
6、一些手持设备(如手机、PDA等)现在还不能很好的支持ajax,比如说我们在手机的浏览器上打开采用ajax技术的网站时,它目前是不支持的,当然,这个问题和我们没太多关系。

分享到:
评论

相关推荐

    AJAX技术和原理分析

    对开发有很大的帮助,尤其面试特别的有用。

    Ajax原理分析及其实现的简单代码

    让更多人了解ajax技术.function _open(requestUrl) { var xmlHttp = false; var versions = ['Microsoft.XMLHTTP', 'MSXML.XMLHTTP', 'Microsoft.XMLHTTP', 'Msxml2.XMLHTTP.7.0', 'Msxml2.XMLHTTP.6.0', 'Msxml2....

    《Ajax技术简介和案例分析》(42P)

    Ajax技术组成 Asynchronous JavaScript and XML 老技术新思路 使用XHTML与CSS的设计标准表现 使用DOM进行动态显示与交互 使用XML和XSLT 进行数据交换与操作 使用XMLHttpRequest进行异步数据传输 使用JavaScript将...

    Ajax技术在矿用考勤系统中的应用

    针对传统的Web考勤系统使用submit方式进行数据交互导致的响应时间长、用户体验差等问题,提出了采用Ajax技术设计矿用考勤系统的方案,分析了Ajax技术原理,介绍了基于Ajax技术的矿用考勤系统实现过程。Ajax技术通过...

    JSP+Ajax网站开发典型实例源码(1~8、10章)

    本书以实例的方式介绍JSP技术和AjaX技术,这两种技术是目前最为流行的服务器端和客户端技术。本书主要内容包括JSP基础实例、JSP数据库实例、JavaBean技术、Servlet技术、Ajax基本技术、Ajax高级技术、Ajax数据库操作...

    Ajax技术组成与核心原理分析

    本文主要为大家分析了Ajax技术组成原理,供大家参考,具体内容如下 1、Ajax 特点:局部刷新、提高用户的体验度,数据从服务器商加载  2、AJax的技术组成 不是新技术,而是之前技术的整合 Ajax: Asynchronous ...

    分析Ajax技术的安全性

    介绍基于HTTP协议传输数据的Ajax技术基本原理和存在...在使用Ajax技术构建的不安全的程序示例基础上,讲解和分析程序实现的过程。例中的程序将捕获和收集在测试网页上所有的操作,并发送消息到服务器上,达到监视的效果

    Ajax 中文手册(快速上手)

    AJAX是一种运用JavaScript和可扩展标记语言(XML),在网络浏览器和服务器之间传送或接受数据的技术。 2. AJAX实例 AJAX可以用来创建更多交互式的网络应用程序。 3. AJAX源代码 简要分析上一章节效果的代码原理 4. ...

    Ajax中文手册(快速上手).rar

    AJAX是一种运用JavaScript和可扩展标记语言(XML),在网络浏览器和服务器之间传送或接受数据的技术。 2. AJAX实例 AJAX可以用来创建更多交互式的网络应用程序。 3. AJAX源代码 简要分析上一章节效果的代码...

    AJAX技术在教学网站中的应用研究

    然后解释AJAX的基本组成技术和核心原理, 展示了最小的AJAX框架应该拥有的组成部分和AJAX数据交互的基础方法。通 过比较AJAX的流行框架,作者选择Doj。框架作为实现本文应用的主要框架。 接着在了解AJAX特性之后提出...

    基于AJAX技术的电子商务系统研究及应用

    本文对AJAX技术及其工作原理进行了深入研究,通过分析传统的商务系统请求/响应方式所带来的用户交互可用性的不足,将AJAX异步请求访问技术应用于电子商务系统,极大增强了用户体验和交互性。对于构建高可用性,智能...

    Ajax基础教程(扫描版)

     ajax技术可以提供高度交互的web应用,给予用户更丰富的页面浏览体验。本书重点介绍ajax及相关的工具和技术,主要内容包括xmlhttprequest对象及其属性和方法、发送请求和处理响应、构建完备的ajax开发工具、使用...

    动力节点老杜Ajax教程配套学习笔记分享

    本套ajax视频对ajax底层实现原理讲解非常透彻,对ajax发送异步请求的每一步都进行了透彻的分析,让你彻底搞懂搞透ajax。课程主要涵盖内容: ajax底层实现原理剖析、 ajax跨域,手写jquery库、 ajax省市联动、 ajax...

    Ajax中文手册(快速上手)

    AJAX是一种运用javascript和可扩展标记语言(XML),在网络浏览器和服务器之间传送或接受数据的技术。 2. AJAX实例 AJAX可以用来创建更多交互式的网络应用程序。 3. AJAX源代码 简要分析上一章节效果的代码原理 4. ...

    Ajax教程chm文档

    AJAX是一种运用(JavaScript)和可扩展标记语言(XML),在网络浏览器和服务器之间传送或接受数据的技术。 2. AJAX - 浏览器支持 AJAX可以跨浏览器支持。 3. XMLHttpRequ 对象三属性 通过简单例子说明这三个属性的重要...

    分页技术原理与实现之无刷新的Ajax分页技术(三)

    紧接着上篇—分页技术原理与实现之Java+Oracle代码实现分页(二) ,本篇继续分析分页技术。上篇讲的是分页技术的代码实现,这篇继续分析一下分页技术的效果控制。 上篇已经用代码简单的实现了一个分页。但是我们都...

    基于flask和echarts的中国疫情数据大屏可视化项目-大数据分析、数据可视化+ajax+JavaS+requests

    jquery + ajax技术实现实时数据更新 官网下载echarts的js文件,找到需要的示例对代码进行修改 后端部分设计 utils.py 与数据库交互 flask的基本运用:static文件夹放css和js文件,templates文件夹下放

Global site tag (gtag.js) - Google Analytics