引言
Python接口自動化有著廣泛的應(yīng)用場景，但是在實際使用過程中，可能會出現(xiàn)一些問題。比如，你不知道HTTP接口的基本構(gòu)成，也不清楚網(wǎng)頁是如何構(gòu)建的。

這時，你就需要深入了解HTTP接口的基本組成和網(wǎng)頁構(gòu)建原理。通過本篇文章的學(xué)習(xí)，你將會快速掌握關(guān)鍵的技能，使得你的工作更為輕松愉快。

1、HTTP簡介
? ? ? ? HTTP協(xié)議是Hyper Text Transfer Protocol（超文本傳輸協(xié)議）的縮寫,是用于從萬維網(wǎng)（WWW:World Wide Web ）服務(wù)器傳輸超文本到本地瀏覽器的傳送協(xié)議。HTTP是一個基于TCP/IP通信協(xié)議來傳遞數(shù)據(jù)（HTML 文件, 圖片文件, 查詢結(jié)果等）?？梢跃唧w查看百度百科關(guān)于HTTP協(xié)議的介紹，簡單點理解就是HTTP是一個屬于應(yīng)用層的面向?qū)ο蟮臒o狀態(tài)的協(xié)議，HTTP協(xié)議工作于客戶端-服務(wù)端架構(gòu)為上，瀏覽器作為HTTP客戶端通過URL向HTTP服務(wù)端即WEB服務(wù)器發(fā)送所有請求。Web服務(wù)器根據(jù)接收到的請求后，向客戶端返回響應(yīng)信息。

2、HTTP原理和網(wǎng)頁基礎(chǔ)
? ? ?2.1、 HTTP基本原理
? ? ? ?在我們訪問一個網(wǎng)頁站點時，首先都是在瀏覽器輸入一段URL，然后才能訪問該網(wǎng)站。什么是URL？URL全稱是：Universal Resource Locator，即統(tǒng)一資源定位符，可以從互聯(lián)網(wǎng)上得到的資源的位置和訪問方法的一種簡潔的表示，是互聯(lián)網(wǎng)上標(biāo)準(zhǔn)資源的地址。包括了訪問的協(xié)議http(https)、訪問路徑和資源名稱、端口號等，如https：//www.baidu.com。

HTTP全稱：Hyper Text Transfer Protocol，中文譯為超文本傳輸協(xié)議。HTTP協(xié)議用于從網(wǎng)絡(luò)傳輸超文本數(shù)據(jù)到本地瀏覽器，并保證高效而準(zhǔn)確地傳送超文本文檔，而HTML源代碼就是一種超文本標(biāo)記語言。該協(xié)議是由萬維網(wǎng)和互聯(lián)網(wǎng)工作小組聯(lián)合制定的，目前廣泛使用的版本是HTTP1.1。除了HTTP外還有HTTPS，就是HTTP的安全版，通過HTTPS傳輸?shù)膬?nèi)容都是經(jīng)過SSL加密的，保證數(shù)據(jù)傳輸?shù)陌踩?。如我們購票用的網(wǎng)站：https://www.12306.cn/，就是這樣的站點。

? ? ?2.2、 HTTP請求過程
? ? ? ? 我們在瀏覽器輸入一個URL站點，回車后正常就能在瀏覽器中看到網(wǎng)站頁面內(nèi)容。實際上，這個過程是瀏覽器向所在的服務(wù)器發(fā)送了一個請求，告訴服務(wù)器需要請求什么東西，服務(wù)器收到請求后進(jìn)行處理和解析這個請求，如果處理解析這個請求OK，那么就返回給瀏覽器對應(yīng)的響應(yīng)。響應(yīng)中包含了頁面的源代碼等內(nèi)容，瀏覽器再對響應(yīng)中的源代碼進(jìn)行解析，最后將解析后的網(wǎng)頁呈現(xiàn)出來。其大概過程就是：瀏覽器請求》服務(wù)器處理解析》服務(wù)器響應(yīng)并傳給瀏覽器》瀏覽器解析呈現(xiàn)網(wǎng)頁。

下面通過實際的網(wǎng)絡(luò)站點，學(xué)習(xí)HTTP請求和響應(yīng)的過程，以及過程中都發(fā)生了怎樣的網(wǎng)絡(luò)請求。以Chrome瀏覽器訪問百度站點：https://www.baidu.com/為例。

?打開Chrome瀏覽器，鼠標(biāo)右鍵菜單選擇【檢查】或者直接快捷鍵【F12】打開開發(fā)者工具，切換到【Network】。在瀏覽器中輸入百度站點：https://www.baidu.com/，回車后，看看發(fā)生的網(wǎng)絡(luò)請求。如下圖：

其中第一條網(wǎng)絡(luò)請求：www.baidu.com，就是瀏覽器向百度服務(wù)器發(fā)送的一條請求訪問百度站點的請求，點擊這個請求，即可看到請求的詳細(xì)信息和內(nèi)容。

首先是General部分，描述了請求的URL、請求的方法、響應(yīng)狀態(tài)碼以及遠(yuǎn)程服務(wù)器的地址和端口；

在往下，就是Response Headers和Request Headers，分別是響應(yīng)頭和請求頭。包含了響應(yīng)和請求的部分相關(guān)信息和內(nèi)容，下面具體看看這個請求和對應(yīng)的響應(yīng)都哪些內(nèi)容。

請求的組成

請求由客戶端即瀏覽器向服務(wù)端發(fā)送，發(fā)送的請求有4個方面的內(nèi)容：請求方法（Request Method）、請求的站點（Request ?URL）、請求頭（Request ?Headers）、請求體（Request Body）

1.請求的方法

常見的請求有g(shù)et,post,put...類型。get類型的接口一般是指獲取信息的接口，比如列表查詢的功能，點擊查詢按鈕就調(diào)用一個get接口，然后把信息返回出來。就是指把內(nèi)容從服務(wù)器（后端）拉下來。Post類型一般是提交表單的功能，比如注冊、導(dǎo)入數(shù)據(jù)之類的就是post接口。就是指把內(nèi)容推到服務(wù)器（后端）上去。

2.請求的站點

請求的網(wǎng)站，就是在瀏覽器輸入的一段URL網(wǎng)址

3.請求頭

請求頭用來說明服務(wù)端使用的附件信息，也就是HTTP協(xié)議規(guī)定的附加內(nèi)容，必須按照協(xié)議規(guī)則辦事。如下圖訪問百度站點的請求頭信息：

?看看請求頭信息的相關(guān)字段說明

Accept：請求報頭域，用來指定客戶端可接受哪些類型的信息，如上圖可以接受text/html等類型的信息

Accept-Encoding和Accept-Language：指定客戶端可接受的編碼和語言

Connection：連接狀態(tài)

Cookie：存儲的Cookie信息，主要用于維持當(dāng)前會話

Host：需要訪問的站點地址

User-Agent：用于向服務(wù)端識別客戶使用的操作系統(tǒng)和瀏覽器版本等信息

4.請求體

請求體一般是承載著POST類型請求的表單數(shù)據(jù)，一般封裝在請求body中使用json格式的數(shù)據(jù)來發(fā)送，GET類型的請求體一般為空。

響應(yīng)的組成

響應(yīng)由服務(wù)端返回給瀏覽器的信息，響應(yīng)的內(nèi)容有3個方面：響應(yīng)狀態(tài)碼（Response Status Code）、響應(yīng)頭（Response Headers）和響應(yīng)體（Response Body）

1.響應(yīng)狀態(tài)碼

響應(yīng)狀態(tài)碼表示服務(wù)器對于請求信息的處理結(jié)果，如200表示響應(yīng)正常、404表示頁面未找到、500表示服務(wù)器出錯等

?2.響應(yīng)頭

響應(yīng)頭包含了服務(wù)端對請求的應(yīng)答信息，如下圖的響應(yīng)頭信息：

看看響應(yīng)頭相關(guān)關(guān)鍵字段說明

Content-Type：文檔類型，指定返回的文檔是什么，如text/html表示返回的是HTML文檔

Server：服務(wù)器的信息，如服務(wù)器名稱、版本等

Set-Cookie：設(shè)置Cookie

Expires：指定響應(yīng)的過期時間

3.響應(yīng)體

一般是處理客戶端方式的HTTP接口請求后，需要返回給客戶端的信息，如大多數(shù)的響應(yīng)boby是封裝成JSON格式的數(shù)據(jù)信息返回到客戶端

2.3、 網(wǎng)頁構(gòu)成
? ? ? ?現(xiàn)代化的網(wǎng)頁呈現(xiàn)給我們的總是絢麗多彩的，有著豐富的視覺感受，不同網(wǎng)頁上面往往有著諸多各式各樣樣子，并搭配合理的排版、豐富的圖片、動畫效果等。那么這些網(wǎng)頁是怎么構(gòu)成的？構(gòu)成網(wǎng)頁主要有三大部分：HTML、CSS、JavaScript，其中HTML構(gòu)成了網(wǎng)頁的基礎(chǔ)架構(gòu)，CSS確定了網(wǎng)頁的排版樣式，JavaScript決定了網(wǎng)頁的可塑造性和動態(tài)呈現(xiàn)。下面具體看看這三大部分：

1.HTML

HTML：全稱Hyper Text Markup Language，即超文本標(biāo)記語言。網(wǎng)頁上的文字、段落、圖片、按鈕等元素就是由HTML定義，如img標(biāo)簽表示圖片，p標(biāo)簽表示段落等等，在Chrome瀏覽器打開百度站點，右擊鼠標(biāo)菜單中選擇【檢查】或者直接【F12】打開開發(fā)者工具在【Elements】選項欄就可以看到網(wǎng)頁的HTML源代碼，如下圖：

可以看到網(wǎng)頁HTML源代碼，每個標(biāo)簽對定義了一個節(jié)點和節(jié)點的屬性，他們構(gòu)成了一個HTML樹。這些節(jié)點標(biāo)簽對陳列在HTML樹中，它們存在的一定的層級關(guān)系，常用父節(jié)點、子節(jié)點和同級節(jié)點表示。具體對于HTML的學(xué)習(xí)，可以參考W3School網(wǎng)站學(xué)習(xí)：http://www.w3school.com.cn/html/index.asp

2.CSS

CSS：全稱Cascading Style Sheets，即層疊樣式表。CSS用來確定網(wǎng)頁頁面的排版樣式的標(biāo)準(zhǔn)，指定了網(wǎng)頁中文字的大小、顏色、位置等屬性。如下圖定位到【百度一下】這個按鈕，查看樣式：

該CSS樣式確定該按鈕的width、height，即寬和高的像素大小，以及文字顏色color：white等信息，按鈕背景色：backgroud

3.JavaScript

JavaScript就是JS，一種腳本語言，用來將JS文件嵌入到HTML代碼中提供交互式的動態(tài)效果，如提示框、輪播圖、下載進(jìn)度條等等。其在HTML的標(biāo)簽對是由script標(biāo)簽對來定義

綜上所述，HTML定義了網(wǎng)頁的內(nèi)容和結(jié)構(gòu)，CSS則描述了網(wǎng)頁元素的布局渲染和位置效果，JavaScript定義了網(wǎng)頁的交互性和動畫效果，這三個構(gòu)成了豐富網(wǎng)頁呈現(xiàn)的基礎(chǔ)架構(gòu)。

在學(xué)習(xí)了解HTTP請求接口以及網(wǎng)頁基本構(gòu)成后，對于HTTP協(xié)議的接口有了明確認(rèn)知后我們再進(jìn)行基于HTTP的接口自動化測試

總結(jié)：

感謝每一個認(rèn)真閱讀我文章的人！！！

作為一位過來人也是希望大家少走一些彎路，如果你不想再體驗一次學(xué)習(xí)時找不到資料，沒人解答問題，堅持幾天便放棄的感受的話，在這里我給大家分享一些自動化測試的學(xué)習(xí)資源，希望能給你前進(jìn)的路上帶來幫助。

??文檔獲取方式：

加入我的軟件測試交流群：632880530免費獲取~（同行大佬一起學(xué)術(shù)交流，每晚都有大佬直播分享技術(shù)知識點）

這份文檔，對于想從事【軟件測試】的朋友來說應(yīng)該是最全面最完整的備戰(zhàn)倉庫，這個倉庫也陪伴我走過了最艱難的路程，希望也能幫助到你！

以上均可以分享，只需要你搜索vx公眾號：程序員雨果，即可免費領(lǐng)取