XMLHTTP的簡(jiǎn)單講解

分享成果，隨喜正能量】行走于塵世，繁忙的工作節(jié)奏，沉重的生活壓力，似乎想讓生活過得行云流水，真的不是一件容易的事情，那么何不讓它變得簡(jiǎn)單一些？或許我們不夠時(shí)尚，至少我們可以簡(jiǎn)約，或許我們不夠精致，至少我們可以簡(jiǎn)潔。把每一段旅途，都當(dāng)做最好的修行；把每一段旅途遇到的困難，都當(dāng)做自己的助力；把每一段旅途中遇到的人，都當(dāng)做今生的因緣。

《VBA信息獲取與處理》教程是我推出第六套教程，目前已經(jīng)是第一版修訂了。這套教程定位于最高級(jí)，是學(xué)完初級(jí)，中級(jí)后的教程。這部教程給大家講解的內(nèi)容有：跨應(yīng)用程序信息獲得、隨機(jī)信息的利用、電子郵件的發(fā)送、VBA互聯(lián)網(wǎng)數(shù)據(jù)抓取、VBA延時(shí)操作，剪貼板應(yīng)用、Split函數(shù)擴(kuò)展、工作表信息與其他應(yīng)用交互，F(xiàn)SO對(duì)象的利用、工作表及文件夾信息的獲取、圖形信息的獲取以及定制工作表信息函數(shù)等等內(nèi)容。程序文件通過32位和64位兩種OFFICE系統(tǒng)測(cè)試。是非常抽象的，更具研究的價(jià)值。

教程共兩冊(cè)，八十四講。今日的內(nèi)容是專題六“VBA中利用XMLHTTP完成網(wǎng)抓數(shù)據(jù)”的第1講：XMLHTTP的簡(jiǎn)單講解

第一節(jié) XMLHTTP的簡(jiǎn)單講解及相關(guān)概念的介紹

現(xiàn)在的社會(huì)是網(wǎng)絡(luò)的社會(huì)，離開了網(wǎng)絡(luò)，很多工作會(huì)變得不通暢。我們?nèi)粘５纳钜彩呛途W(wǎng)絡(luò)緊密聯(lián)系一起的，那么網(wǎng)絡(luò)是如何搭建的呢？我們可以通過本講的講解了解到HTTP 超文本傳輸協(xié)議，TCP/IP的介紹，XMLHTTP的介紹，等等。

1 什么是XMLHTTP,它是用來做什么的？

1） XML的介紹 XML指可擴(kuò)展標(biāo)記語言（EXtensible Markup Language），設(shè)計(jì)宗旨是傳輸數(shù)據(jù)，是W3C （萬維網(wǎng)聯(lián)盟World Wide Web Consortium）的推薦標(biāo)準(zhǔn)。XML 是各種應(yīng)用程序之間進(jìn)行數(shù)據(jù)傳輸?shù)淖畛Ｓ玫墓ぞ撸⑶以谛畔⒋鎯?chǔ)和描述領(lǐng)域變得越來越流行。

2） HTTP的介紹 HTTP 超文本傳輸協(xié)議（HyperText Transfer Protocol，超文本傳輸協(xié)議）是因特網(wǎng)上應(yīng)用最為廣泛的一種網(wǎng)絡(luò)傳輸協(xié)議，所有的WWW文件都必須遵守這個(gè)標(biāo)準(zhǔn)。

HTTP是一個(gè)基于TCP/IP通信協(xié)議來傳遞數(shù)據(jù)（HTML 文件, 圖片文件, 查詢結(jié)果等）。

3) TCP/IP的介紹 TCP/IP是供已連接因特網(wǎng)的計(jì)算機(jī)進(jìn)行通信的通信協(xié)議(Transmission Control Protocol / Internet Protocol)。定義了電子設(shè)備（比如計(jì)算機(jī)）如何連入因特網(wǎng)，以及數(shù)據(jù)如何在它們之間傳輸?shù)臉?biāo)準(zhǔn)。

TCP 用于應(yīng)用程序之間的通信。當(dāng)應(yīng)用程序希望通過 TCP 與另一個(gè)應(yīng)用程序通信時(shí)，它會(huì)發(fā)送一個(gè)通信請(qǐng)求。這個(gè)請(qǐng)求必須被送到一個(gè)確切的地址。在雙方“握手”之后，TCP 將在兩個(gè)應(yīng)用程序之間建立一個(gè)全雙工 (full-duplex) 的通信。這個(gè)全雙工的通信將占用兩個(gè)計(jì)算機(jī)之間的通信線路，直到它被一方或雙方關(guān)閉為止。

IP 用于計(jì)算機(jī)之間的通信。IP 是無連接的通信協(xié)議。它不會(huì)占用兩個(gè)正在通信的計(jì)算機(jī)之間的通信線路。這樣，IP 就降低了對(duì)網(wǎng)絡(luò)線路的需求。每條線可以同時(shí)滿足許多不同的計(jì)算機(jī)之間的通信需要。通過 IP，消息（或者其他數(shù)據(jù)）被分割為小的獨(dú)立的包，并通過因特網(wǎng)在計(jì)算機(jī)之間傳送。IP 負(fù)責(zé)將每個(gè)包路由至它的目的地。

TCP/IP協(xié)議意味著 TCP 和 IP 在一起協(xié)同工作。TCP 負(fù)責(zé)應(yīng)用軟件（比如你的瀏覽器）和網(wǎng)絡(luò)軟件之間的通信。IP 負(fù)責(zé)計(jì)算機(jī)之間的通信。TCP 負(fù)責(zé)將數(shù)據(jù)分割并裝入 IP 包，然后在它們到達(dá)的時(shí)候重新組合它們。IP 負(fù)責(zé)將包發(fā)送至接受者。

4) XMLHTTP的介紹 XMLHTTP是一套可以在Javascript、VbScript、Jscript等腳本語言中通過http協(xié)議傳送或從接收XML及其他數(shù)據(jù)的一套API。XmlHttp最大的用處是可以更新網(wǎng)頁的部分內(nèi)容而不需要刷新整個(gè)頁面。

來自MSDN的解釋：XmlHttp提供客戶端同http服務(wù)器通訊的協(xié)議。客戶端可以通過XmlHttp對(duì)象(MSXML2.XMLHTTP.3.0)向http服務(wù)器發(fā)送請(qǐng)求并使用微軟XML文檔對(duì)象模型Microsoft? XML Document Object Model (DOM)處理回應(yīng)。

現(xiàn)在的絕對(duì)多數(shù)瀏覽器都增加了對(duì)XmlHttp的支持，IE中使用ActiveXObject方式創(chuàng)建XmlHttp對(duì)象，其他瀏覽器如：Firefox、Opera等通過window.XMLHttpRequest來創(chuàng)建xmlhttp對(duì)象.

2 應(yīng)用XMLHTTP抓取數(shù)據(jù)的步驟

1）創(chuàng)建XMLHTTP對(duì)象　//需MSXML4.0支持

2）打開與服務(wù)端的連接，同時(shí)定義指令發(fā)送方式，服務(wù)網(wǎng)頁(URL)和請(qǐng)求權(quán)限等。客戶端通過Open命令打開與服務(wù)端的服務(wù)網(wǎng)頁的連接。與普通HTTP指令傳送一樣，可以用"GET"方法或"POST"方法指向服務(wù)端的服務(wù)網(wǎng)頁。　

3）發(fā)送指令。　

4）等待并接收服務(wù)端返回的處理結(jié)果。　

5）釋放XMLHTTP對(duì)象

3 XMLHTTP的屬性及方法

1) XMLHTTP的常見屬性：　

onreadystatechange：在同步執(zhí)行方式下獲得返回結(jié)果的事件句柄。只能在DOM中調(diào)用。　

responseBody：　　　結(jié)果返回為無符號(hào)整數(shù)數(shù)組。　

responseStream：　　結(jié)果返回為IStream流。　

responseText：　　　結(jié)果返回為字符串。　

responseXML：　　　結(jié)果返回為XML格式數(shù)據(jù)。

2） XMLHTTP的常用方法：　

① Open（bstrMethod,　bstrUrl,　varAsync,　bstrUser,　bstrPassword）創(chuàng)建一個(gè)新的http請(qǐng)求，并指定此請(qǐng)求的方法、URL以及驗(yàn)證信息(用戶名/密碼)打開指定網(wǎng)址

bstrMethod：　　數(shù)據(jù)傳送方式，即GET或POST。　

bstrUrl：　　　　服務(wù)網(wǎng)頁的URL。　

varAsync：　　　是否同步執(zhí)行。缺省為True，即同步執(zhí)行，但只能在DOM中實(shí)施同步執(zhí)行。用中一般將其置為False，即異步執(zhí)行。　

bstrUser：　　　　用戶名，可省略。　

bstrPassword：用戶口令，可省略。　

setRequestHeader（bstrHeader,　bstrvalue）

bstrHeader：HTTP　頭(header)　

bstrvalue：　HTTP　頭(header)的值　

如果Open方法定義為POST，可以定義表單方式上傳：　

xmlhttp.setRequestHeader（"Content-Type",　"application/x-www-form-urlencoded"）　

② Send（varBody）發(fā)送請(qǐng)求到http服務(wù)器并接收回應(yīng)

varBody：指令集。可以是XML格式數(shù)據(jù)，也可以是字符串，流，或者一個(gè)無符號(hào)整數(shù)數(shù)組。也可以省略，讓指令通過Open方法的URL參數(shù)代入。

③ abort 取消當(dāng)前請(qǐng)求

④ getAllResponseHeaders 獲取響應(yīng)的所有http頭

⑤ getResponseHeader 從響應(yīng)信息中獲取指定的http頭

以上我給出了一些常用的屬性和方法，其他的大家可以參考相關(guān)的資料，或許我在今后的課程中會(huì)用到時(shí)講解。同時(shí)我們還要主要下面的注意點(diǎn)：

1、ResponseBody是二進(jìn)制的數(shù)據(jù)，是服務(wù)器傳來的沒有經(jīng)過任何加工的數(shù)據(jù)。

2 ResponseText是按照utf-8編碼把ResponseBody轉(zhuǎn)換而成，也就是：ResponseText=ByteToStr(ResponseBody,"UTF-8")

本節(jié)知識(shí)點(diǎn)回向：了解一些概念，HTTP，TCP/IP，XMLHTTP，以及XMLHTTP的常用屬性和方法。

我20多年的VBA實(shí)踐經(jīng)驗(yàn)，全部濃縮在下面的各個(gè)教程中，教程學(xué)習(xí)順序：

HTML 頁面中顯示 XML 數(shù)據(jù)

在下面的實(shí)例中，我們打開一個(gè) XML 文件（"cd_catalog.xml"），然后遍歷每個(gè) CD 元素，并顯示HTML 表格中的 ARTIST 元素和 TITLE 元素的值：

實(shí)例

<html>

<body>

if (window.XMLHttpRequest)

{// code for IE7+, Firefox, Chrome, Opera, Safari

xmlhttp=new XMLHttpRequest();

}

else

{// code for IE6, IE5

xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");

}

xmlhttp.open("GET","cd_catalog.xml",false);

xmlhttp.send();

xmlDoc=xmlhttp.responseXML;

document.write("<table border='1'>");

var x=xmlDoc.getElementsByTagName("CD");

for (i=0;i<x.length;i++)

{

document.write("<tr><td>");

document.write(x[i].getElementsByTagName("ARTIST")[0].childNodes[0].nodeValue);

document.write("</td><td>");

document.write(x[i].getElementsByTagName("TITLE")[0].childNodes[0].nodeValue);

document.write("</td></tr>");

}

document.write("</table>");

</script>

</body>

</html>

如您還有不明白的可以在下面與我留言或是與我探討QQ群308855039，我們一起飛！

eact定義的一種類似于XML的JS擴(kuò)展語法，用來簡(jiǎn)化創(chuàng)建虛擬DOM

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>jsx</title>
        <style>
            .title{
                background-color: orange:
                width: 200px;
            }
        </style><!--定義個(gè)樣式，也可以寫在CSS文件里，引入進(jìn)來-->
    </head>

    <body>
        <div id="test"></div>
        <script type="text/javascript" src="../js/react.development.js"></script>
        <script type="text/javascript" src="../js/react-dom.development.js"></script>
        <script type="text/javascript" src="../js/babel.min.js"></script>
    </body>
    <script type="text/babel">
        const myid= "lOVE you"
        const mydata= "hellO jsx"
        const VDOM = ( // <!--h2標(biāo)簽引入樣式，用className,span標(biāo)簽引入內(nèi)聯(lián)樣式的時(shí)候，不是用雙引號(hào)，而是雙花括號(hào)，-->
        <div>
            <h2 className="title" id={myid.toLowerCase()}> 
                <span style={{color:'red',fontSize:'29px'}}>{mydata.toLowerCase()}</span>
            </h2>)// <!--標(biāo)簽中混入JS表達(dá)式時(shí)要用花括號(hào){},如這里mydata取值 -->
            //jsx中只能有一個(gè)根標(biāo)簽，比如這里的h2，可以在h2的外面包一層div，就可以寫兩個(gè)h2
            <h2 className="title" id={myid.toUpperCase()}> 
                <span style={{color:'red',fontSize:'29px'}}>{mydata.toLowerCase()}</span>
            </h2>)
            //標(biāo)簽首字母若是小寫字母，則將該標(biāo)簽轉(zhuǎn)為html中同名元素，若html中無該標(biāo)簽對(duì)應(yīng)的同名元素，則報(bào)錯(cuò)
            //標(biāo)簽首字母若是大寫字母，react就去渲染對(duì)應(yīng)的組件，若組件沒有定義，則報(bào)錯(cuò)
        </div>

        ReactDOM.render(VDOM,document.getElementById('test'))
    </script>
</html>

一個(gè)jsx的小練習(xí)

 <script type="text/babel">
        const data=['A','B','C']
        const VDOM = (
            <div>   //js表達(dá)式會(huì)產(chǎn)生一個(gè)值。js語句（代碼）,有if，for，switch判斷，
                <h1>jsx框架</h1>
                <ul>
                  {
                    data.map((item,index)=>{
                        return <li key={index}>{item}</li>
                    }) //item拿到data里面對(duì)應(yīng)的值，map遍歷的第二個(gè)值是索引值，
                  }
                </ul>
            </div>
        )
        ReactDOM.render(VDOM,document.getElementById('test'))
    </script>

對(duì)應(yīng)的網(wǎng)頁如下：

模塊是向外提供特定功能的js程序，一般就是一個(gè)js文件。

組件比模塊更高一級(jí)，比如實(shí)現(xiàn)一個(gè)網(wǎng)頁的頭部的html，字體，css，js，圖像這些元素組合在一起，就形成了頭部這個(gè)組件。

組件分為函數(shù)式組件和類式組件：

函數(shù)式組件：

<script type="text/babel">
function MyComponent(){
return <h2>show the function component</h2>
}
ReactDOM.render(<MyComponent/>,document.getElementById('test'))
//<MyComponent/>要寫上標(biāo)簽，函數(shù)定義首字母需要大寫
</script>

執(zhí)行了ReactDOM.render(<MyComponent/>。。之后，React解析組件標(biāo)簽，找到MyComponent組件，發(fā)現(xiàn)組件是使用函數(shù)定義的，隨后調(diào)用該函數(shù)，將返回的虛擬DOM轉(zhuǎn)為真是DOM，隨后呈現(xiàn)在頁面中。

類式組件：

在線咨詢

上一篇：推薦！用html制作ppt的Webslides
下一篇：HTML 屬性

您的項(xiàng)目需求

*請(qǐng)認(rèn)真填寫需求信息，我們會(huì)在24小時(shí)內(nèi)與您取得聯(lián)系。

整合營(yíng)銷服務(wù)商