zoukankan      html  css  js  c++  java
  • Web请求中同步与异步的区别

    普通的B/S模式就是同步,而AJAX技术就是异步,当然XMLHttpReques有同步的选项。

    同步:提交请求->等待服务器处理->处理完毕返回。这个期间客户端浏览器不能干任何事。

    异步: 请求通过事件触发->服务器处理(这是浏览器仍然可以作其他事情)->处理完毕。

    举个生动的例子吧:

    同步就是你叫我去吃饭,我听到了就和你去吃饭;如果没有听到,你就不停的叫,直到我告诉你听到了,才一起去吃饭。

    异步就是你叫我,然后自己去吃饭,我得到消息后可能立即走,也可能等到下班才去吃饭。

    所以,要我请你吃饭就用同步的方法,要请我吃饭就用异步的方法,这样你可以省钱。

    再举个例子,打电话时同步,发短信是异步。

    ajax的open()方法

    用法:open(http-method,url,async,userID,password)

    后面是帐号和密码,在禁止匿名访问的http页面中,需要用户名和口令。

    ajax.open方法中,第3个参数是设同步或者异步。prototype等js类库一般都默认为异步,即设为true。 先说下同步的情况下,js会等待请求返回,获取status。不需要onreadystatechange事件处理函数。 而异步则需要onreadystatechange事件处理,且值为4再正确处理下面的内容。

    首先看看异步处理方式。

    其中async是一个布尔值。如果是异步通信方式(true),客户机就不等待服务器的响应;如果是同步方式(false),客户机就要等到服务器返回消息后才去执行其他操作。我们需要根据实际需要来指定同步方式,在某些页面中,可能会发出多个请求,甚至是有组织有计划有队形大规模的高强度的request,而后一个是会覆盖前一个的,这个时候当然要指定同步方式:Flase。

    请求方式

    GET

    最为常见的HTTP请求,普通上网浏览页面就是GET。GET方式的参数请求直接跟在URL后,以问号开始。(JS中用window.location.search获得)。参数可以用encodeURIComponent进行编码,使用方式:

    1 var EnParam = encodeURIComponent(param);
    • URL只支持大约2K的长度,即2048字符数;
    • 使用GET进行AJAX请求时候会缓存导致出现的页面不是正确的,一般方法加random参数值;
    • ajax.send(null)。

    POST

    向服务器提交数据用到。

    • 需要将form表单中的值先取出转换成字符串,用&符号连接,(同GET传参数一样);
    • 提交数据量2GB;
    • 使用ajax.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'),处理提交的字符串;
    • ajax.send(strings),这个strings表示form中需要提交的内容,例如a=1&b=2类似这样的字符串。

    程序示例

    同步传输模式:

     1 function RequestByGet(nProducttemp,nCountrytemp)
     2 {
     3     var xmlhttp
     4     if (window.XMLHttpRequest)  
     5     {  
     6          //isIE   =   false;  
     7          xmlhttp   =   new   XMLHttpRequest();  
     8     }  
     9     else if (window.ActiveXObject)
    10     {  
    11          //isIE   =   true;  
    12          xmlhttp   =   new   ActiveXObject("Microsoft.XMLHTTP");  
    13     }
    14                  
    15     //Web page location.
    16     var URL="http://www.baidu.com/;
    17     xmlhttp.open("GET",URL, false);
    18     //xmlhttp.SetRequestHeader("Content-Type","text/html; charset=Shift_JIS")
    19     xmlhttp.send(null);
    20     var result = xmlhttp.status;
    21    
    22     //OK
    23     if(result==200)
    24     {
    25         document.getElementById("div_RightBarBody").innerHTML=xmlhttp.responseText;
    26     }
    27     xmlhttp = null;
    28 }

    异步传输模式:

     1 var xmlhttp
     2 function RequestByGet(nProducttemp,nCountrytemp)
     3 {
     4     if (window.XMLHttpRequest)  
     5     {  
     6          //isIE   =   false;  
     7          xmlhttp   =   new   XMLHttpRequest();  
     8     }  
     9     else if (window.ActiveXObject)
    10     {  
    11          //isIE   =   true;  
    12          xmlhttp   =   new   ActiveXObject("Microsoft.XMLHTTP");  
    13     }
    14                  
    15     //Web page location.
    16     var URL="http://www.baidu.com/";
    17     xmlhttp.open("GET",URL, true);
    18     xmlhttp.onreadystatechange = handleResponse;
    19     //xmlhttp.SetRequestHeader("Content-Type","text/html; charset=UTF-8")
    20     xmlhttp.send(null);  
    21 }
    22 function handleResponse()
    23 {
    24     if(xmlhttp.readyState == 4 && xmlhttp.status==200)
    25     {
    26         document.getElementById("div_RightBarBody").innerHTML=xmlhttp.responseText;
    27         xmlhttp = null;
    28     }
    29 }

    原文链接:http://www.nowamagic.net/program/program_SynchronousAndAsynchronous.php

  • 相关阅读:
    Interview with BOA
    Java Main Differences between HashMap HashTable and ConcurrentHashMap
    Java Main Differences between Java and C++
    LeetCode 33. Search in Rotated Sorted Array
    LeetCode 154. Find Minimum in Rotated Sorted Array II
    LeetCode 153. Find Minimum in Rotated Sorted Array
    LeetCode 75. Sort Colors
    LeetCode 31. Next Permutation
    LeetCode 60. Permutation Sequence
    LeetCode 216. Combination Sum III
  • 原文地址:https://www.cnblogs.com/wangweiabcd/p/3885989.html
Copyright © 2011-2022 走看看