文档介绍：
Ajax编程技术第三章 Ajax和服务器端技术
3.1 概述
如果只使用XMLHttpRequest更新页面,而不使用任何来自服务器输入的技术,不能称之为Ajax。
使用Ajax的最大优势之一就是,可以为Ajax应用程序选择自己偏爱的服务器端技术,, PHP, Java 等。
对于每种服务器端技术来说,Ajax 读取XMLHttpRequest 对象与服务器通信的方式基本上是相同的,但服务器接收到信息后的处理方式就个不相同了。
3-2
3.2 Ajax和服务器端技术
表单和HTML控件
Ajax并未改变HTML控件的工作方式和从其获得数据的方式,服务器也采用以往的方式来接收它们。但是有两个问题:
调用服务器端页面的方式;
HTML表单完全从页面中删除或修改后,不能按预期方式工作。我们分别解释。
3-3
3.2 Ajax和服务器端技术
传统的表单的提交模型
提交表单的做法通常是建立一个带有按钮的表但,用户输入完数据后单击按钮后,就将此表单提交给服务器。
传统的ASP和PHP使用表单的ACTION属性将用户从原始页面重定向到响应页面。该处理是在用户被重定向新页面之前在服务器上完成,新页面用来显示相应的响应数据。
<form>
</form>
Button
Request.php
服务器
返回数据
Response.php
服务器
进行处理
用户单击按钮
提交数据
服务器
返回数据
浏览器显示的原始页面
提交后浏览器重新定向的页面
3-4
3.2 Ajax和服务器端技术
在Ajax之前,我们使用的都是这种传统的提交、重定向模式;而Ajax提出了使用脚本提交页面的思想。
Ajax/JavaScript提交模型
Ajax使用的JavaScript提交模型在以前传统的提交模型基础上进行了变化。在此模型中,表单可以可选地从模型中删除。
这种新的模型使用JavaScript截取事件调用,当该事件发生时(如用户单击提交按钮),提交的数据传递给对应的脚本,然后有脚本发起对服务器的调用。
脚本甚至不必马上提交数据,可以继续等待其它条件也满足后再提交数据。
在该模型中,因为脚本可以立即响应事件且不必等待数据的提交,所以从服务器返回的数据也不必马上显示给用户,而脚本也不必像以前一样被动等待服务器的响应。
3-5
3.2 Ajax和服务器端技术
<form
onEbent…>
Default.htm
服务器端
进行处理
Response.php
事件发生
脚本到
服务器
浏览器显示的页面
部分页
面更新
服务器返回数据
Jscript.js
3-6
3.3 服务器端的情况
javaScript用来启用客户机/服务器之间的交互。C/S中的服务器端会接收来自HTTP请求的数据,然后处理数据,再以服务器响应所采用的格式返回数据。
向服务器提交数据
Ajax使用XMLHttpRequest对象向服务器提交数据,这一过程分三个步骤:
设置事件在接收数据时触发;
随请求一起调用open方法;
发送请求。
3-7
3.3 服务器端的情况
提交使用格式
XMLHttpRequest.opwn(method, URLto call, asynchronous or synchronous);
其中Method:有两种方式,GET、POST:
用GET方式:
XMLHttpRequest.open(“GET”, “Reponse.php&value=1”, “true”);
xHRObject.send(null);
用POST方式:
var argument = “value=“;
argument += ponent(data)
XMLHttpRequest.open(“POST”, “Reponse.php”, “true”);
xHRObject.send(argument);
3-8
3.3 服务器端的情况
服务器接收请求
JavaScript使用XMLHttpRequest对象的POST或GET方法,将数据封装到URL或Request中,向服务器提交数据。
在PHP中,可以使用$_GET、$_POST、$_REQUEST收集客户机传上来的数据。
在ASP、中,可以使用QueryString、Form或Params收集客户机传上来的数据。
从HTML表单接收数据和从源自JavaScript的请求接收数据没有差别。
服务器获得数据后,就可以按照自己的方式进行处理,然后将处理结果返回给客户端。
3-9
3.4 编写HTTP响应
与传统的服务器端技术所使用的事件顺序不同,在Ajax 中,用户要显示的信息无法立即写到页面中。取而代之的是,必须将信息封装在HTTP响应中。办法很简单:
在PHP中,可以使用echo 命令:
$data = “This is our data.”;
echo $data;
中,可以Response.Write方法:
string data = “This is our data.”;
Response.Write(data);
3-10

1