AJAX和MVC总结

总结时间：2010年10月19日   总结人：吴同    指导老师：熊向军

      http协议是Web应用中的主要协议，而http协议是基于请求响应模型的。客户端向服务器发送一个请求，请求头包含请求的方法、 地址、客户端信息等等。服务器则以一个状态行作为响应，相应的内容包成功或者错误编码加上包含服务器信息等等。 由于http协议具有上述特点，客户端每次更新信息都必须向服务器发送请求，收到信息后更新整个页面。

AJAX：

      如果一个网页有大量信息，而客户端只更新了其中的一小部分，服务器返回响应更新了整个页面，而其中大部分内容和之前的都一样，造成了时间和流量的浪费。可不可以只刷新需要刷新的部分，不用刷新整个页面呢？AJAX为我们提供了这种便利。 AJAX即异步JavaScript和XML技术，核心在于使用XMLHTTPRequest对象发送异步请求。主要有三个流程：

1.  创建异步请求对象：创建一个XMLHTTPRequest对象，用来发送异步请求。需要注意的是不同浏览器有不同的创建方法，在创建前需要判断一下浏览器的类型，调用合适的方法。
2. 编写回调方法：服务器返回一个结果，将结果显示在页面的哪个位置、显示返回结果中的哪些信息等等体现在这个方法中，即服务器返回结果处理方法。首先要通过 调用异步请求对象的readyState 和status两个函数看服务器响应的状态 。readyState 有5个状态 ，其中返回0表示open函数已经调用，返回1表示请求已经接收但还没发送数据，2表示服务器正在处理数据，3表示已经有部分数据返回，4表示服务器已经完成响应； status则有许多种状态，最常见的有：404——网页未找到，400——客户端出错，500——服务器出错，200——一切正常。判断完后，应答正常则可以得到服务器返回的数据，显示到页面上。
3. 发送异步请求：即向服务器发送请求。首先得到异步请求；然后绑定回调方法（第二步编写的函数） ，<异步请求对象.onreadystatechange方法=回调函数名;>这样绑定，注意在回调函数名后不加“（）”；再选择发送方法(post/get)和发送URL，<异步请求对象名.open(“POST/GET”,"servlet/jsp页面"，true)>，true表示是异步请求；然后编写服务器的解码格式<异步请求名.setRequestHeader(" Content-Type" ,  "application/x-www-formurlencoded ")>；最后再发送参数即可。

4. 代码示例：
   
   <script type="text/javascript"> 
   //定义了XMLHttpRequest对象 var request; //设置全局变量，方便使用 
   //创建XMLHttpRequest对象函数 
   function getRequestObject() { 
        if (window.ActiveXObject) { request=new ActiveXObject      ("Microsoft.XMLHTTP"); } else if (window.XMLHttpRequest) {
    request=new XMLHttpRequest(); } else
    { window.alert("你的浏览器不支持XMLHTTPRequest，将无使用AJAX功能！");} 
   }
    //回调方法实现：显示一个对话框，显示返回的文本内容 
   function processResult() {
    if ((request.readyState == 4) && (request.status == 200)) {
    alert("服务器返回的是: "+request.responseText); } 
   }
    //发送请求,绑定回调方法
    function sendRequest() { 
   //创建XMLHTTPRequest对象 
   getRequestObject();
    //绑定回调方法， 
   request.onreadystatechange=processResult; 
   //发送请求 
   // request.open("GET", "index.jsp", true);
    //发送Post请求 request.open("POST", "servlet", true); request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); 
   var userName=document.getElementById("para").value; 
   //将请求参数发送上去
    request.send("para="+para); 
   } 
   </script> 
   
   

    

  AJAX的优点优点在于可以异步传输数据，用户的操作不会被打断，减少数据的的冗余，让界面更加的精美，有更多人性化的操作。缺点是不能使用浏览器的后退功能。

 

 

 

MVC:

• MVC是Model、view、control的缩写，Web制作中的一种思想方法。

   

• 考虑到网页制作中程序和界面分离的情况，把请求响应的过程分为三个模块：1、客户端是界面显示模块；2、服务器数据处理和控制模块；3、是数据存放模块。

  这样美工、程序员、数据库管理员只需要做好自己那块即可，如改变网页的外观不需要修改程序，而修改程序不需要改变数据库，是低耦合的一种体现。

• html和jsp生成动态网页，显示页面；servlet负责转发到对应得Action，进行控制；JavaBean（pojo和dao）负责数据模块。
  
   

• 对XML文件配置：

• <servlet-name>ControlServlet</servlet-name>
  	<servletclass>cn.wutong.servlet.ControlServlet</servlet-class>
  <!-- 将具体Action名字和全类名配置到Servlet参数中 -->
       <init-param>
        	<param-name>ActionName</param-name>
  	    	<paramvalue>cn.wutong.action.TheActionImpClassName</param-value>
       </init-param>
    </servlet>
  	<servlet-mapping>
        <servlet-name>ControlServlet</servlet-name>
        <url-pattern>*.do</url-pattern>
    </servlet-mapping>

   

   

这份总结写得比较仓促，不足之处还请指出~