快捷導航

Ajax核心XMLHttpRequest總結(jié)

更新時間：2015年02月26日 14:53:44 投稿：hebedich

本文主要是給大家總結(jié)了一下Ajax的核心內(nèi)容XMLHttpRequest的相關(guān)知識，十分的詳細，推薦給大家，需要的小伙伴參考下。

Ajax:即"Asynchronous JavaScript and XML"（異步JavaScript和XML），一門綜合性的技術(shù)：運用JavaScript對象XMLHttpRequest進行異步數(shù)據(jù)交換；JavaScript操作DOM實現(xiàn)動態(tài)效果；運用XHTML+CSS表達信息；XML和XSLT操作數(shù)據(jù)。此篇文章重點介紹使用XMLHttpRequest對象與服務(wù)器端進行異步數(shù)據(jù)交換。

使用方法
XMLHttpRequest五步使用法：

復制代碼代碼如下:

    1.創(chuàng)建對象； 

    2.注冊回調(diào)函數(shù)； 

    3.使用open方法設(shè)置和服務(wù)器交互的基本信息； 

    4.設(shè)置發(fā)送的數(shù)據(jù)，開始和服務(wù)器端交互； 

    5.實現(xiàn)回調(diào)函數(shù)。

由于每次應(yīng)用XMLHttpRequest對象時，都要進行五步操作，因此，可將該對象的使用封裝為js文件中，傳遞部分參數(shù)使用其方法就可以完成相應(yīng)功能，實現(xiàn)如下：

復制代碼代碼如下:

    //使用封裝方法人員只提供http的請求，url地址，數(shù)據(jù)，成功和失敗的回調(diào)的方法 

    //1.定義XMLHttpRequest對象的構(gòu)造方法 

    var MyXMLHttpRequest =function（）{ 

    var xmlhttprequest; 

    if（window.XMLHttpRequest）{ 

    //IE7,IE8,FireFox,Mozillar,Safari,Opera 

    //alert（"IE7,IE8,FireFox,Mozillar,Safari,Opera"）； 

    xmlhttprequest = new XMLHttpRequest（）； 

    //解決瀏覽器在服務(wù)器端響應(yīng)由于沒有Text頭的時候可能無法工作的問題 

    if（xmlhttprequest.overrideMimeType）{ 

    xmlhttprequest.overrideMimeType（"text/xml"）； 

    } 

    }else if（window.ActiveXObject）{ 

    //IE6,IE5.5,IE5 

    alert（"IE6,IE5.5,IE5"）； 

    var activexName =["MSXML2.XMLHTTP","Microsoft.XMLHTTP"]; 

    for （var n=0;n

擴展問題

    1.瀏覽器緩存
    2.中文亂碼
    3.跨域訪問

對于問題1、問題3都可以通過更改url地址的方法得以解決。問題1可在url地址尾添加時間戳，問題3通過代理方式進行解決。只需在send（）中的第三步執(zhí)行前添加相應(yīng)判斷即可：

復制代碼代碼如下:

    //解決緩存的轉(zhuǎn)換：增加時間戳 

    if（url.indexOf（"?"） >= 0 ）{ 

    url = url + "&t=" + （new Date（））。valueOf（）； 

    } else { 

    url = url + "?t=" + （new Date（））。valueOf（）； 

    } 

    //解決跨域的問題 

    if（url.indexOf（"http://"） >= 0） { 

    url.replace（"?","&"）； 

    url = "Proxy?url=" + url; 

    }

問題3對應(yīng)代理服務(wù)端實現(xiàn)：

復制代碼代碼如下:

    /**
    * Handles the HTTP GET method.
    *
    * @param request servlet request
    * @param response servlet response
    * @throws ServletException if a servlet-specific error occurs
    * @throws IOException if an I/O error occurs
    */
    @Override
    protected void doGet（HttpServletRequest request, HttpServletResponse response）
    throws ServletException, IOException {
    //獲取參數(shù)，最后得到請求url地址類似于：url = http://192.168…/AJAX/AJAXServer?aa=11&bb=22&cc=33
    StringBuilder url = new StringBuilder（）；
    url.append（request.getParameter（"url"））；
    //獲取訪問的跨域地址url = http://192.168…/AJAX/AJAXServer
    Enumeration enu = request.getParameterNames（）；
    boolean flag = false;       //定義標志變量，表示是否為拼接的第一個參數(shù)
    while（enu.hasMoreElements（））{
    String paramName = （String） enu.nextElement（）；
    if（！paramName.equals（"url"））{
    String paramValue = request.getParameter（paramName）；
    paramValue = URLEncoder.encode（paramValue,"utf-8"）；
    if（！flag）{
    url.append（"?"）。append（paramName）。append（"="）。append（paramValue）；
    flag = true;
    } else {
    url.append（"&"）。append（paramName）。append（"="）。append（paramValue）；
    }
    }
    }
    response.setContentType（"text/html;charset=utf-8"）；
    PrintWriter out = response.getWriter（）；
    if（url != null && url.length（） > 0）{
    URL connectionUrl = new URL（url.toString（））；
    BufferedReader reader = new BufferedReader（new InputStreamReader（connectionUrl.openStream（），"utf-8"））；

以上就是本文的全部內(nèi)容了，希望大家能夠喜歡。

您可能感興趣的文章: