一、手寫ajax請(qǐng)求

1. get

        // 1.創(chuàng)建一個(gè)XMLHttpRequest對(duì)象let xhr = new XMLHttpRequest();// 2.設(shè)置請(qǐng)求行xhr.open('get', 'http://localhost:3000/get');// 3.設(shè)置請(qǐng)求頭xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');// 4.設(shè)置請(qǐng)求體xhr.send(null);// 5.監(jiān)聽請(qǐng)求狀態(tài)xhr.onreadystatechange = function() {// 6.判斷請(qǐng)求狀態(tài)if(xhr.readyState === 4 && xhr.status === 200) {// 7.獲取響應(yīng)體console.log(xhr.responseText);}}

2. post

        // 1.創(chuàng)建一個(gè)XMLHttpRequest對(duì)象let xhr = new XMLHttpRequest();// 2.設(shè)置請(qǐng)求行xhr.open('post', 'http://localhost:3000/post');// 3.設(shè)置請(qǐng)求頭xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');// 4.設(shè)置請(qǐng)求體xhr.send('name=小明&age=18'); // 這里得傳字符串// 5.監(jiān)聽請(qǐng)求狀態(tài)xhr.onreadystatechange = function() {// 6.判斷請(qǐng)求狀態(tài)if(xhr.readyState === 4 && xhr.status === 200) {// 7.獲取響應(yīng)體console.log(xhr.responseText);}}

3. xhr.readyState

xhr.readyState 有以下狀態(tài)值，分別代表的意思如下：

狀態(tài)值	意思
0	未初始化，尚未調(diào)用open方法
1	啟動(dòng)，已經(jīng)調(diào)用open方法
2	發(fā)送，已經(jīng)調(diào)用send方法
3	接收，正在接收響應(yīng)數(shù)據(jù)
4	完成，已經(jīng)接收到全部響應(yīng)數(shù)據(jù)

請(qǐng)注意，在這個(gè)表格中，狀態(tài)值是從0開始的，0代表xhr對(duì)象已經(jīng)被創(chuàng)建但尚未調(diào)用open方法，直到4代表請(qǐng)求已完成且響應(yīng)數(shù)據(jù)已接收完畢。

4. xhr.status

http狀態(tài)碼

狀態(tài)碼	含義	說明
200	OK	請(qǐng)求成功
301	Moved Permanently	資源被永久移動(dòng)到新的URL
302	Found	資源被臨時(shí)移動(dòng)到新的URL
400	Bad Request	請(qǐng)求有誤，服務(wù)器無法處理
401	Unauthorized	請(qǐng)求需要身份驗(yàn)證
403	Forbidden	服務(wù)器拒絕該請(qǐng)求
404	Not Found	請(qǐng)求的資源不存在
500	Internal Server Error	服務(wù)器遇到錯(cuò)誤
502	Bad Gateway	服務(wù)器作為網(wǎng)關(guān)或代理時(shí)收到無效響應(yīng)
503	Service Unavailable	服務(wù)器暫時(shí)不可用
504	Gateway Timeout	服務(wù)器作為網(wǎng)關(guān)或代理時(shí)在等待上游服務(wù)器響應(yīng)時(shí)超時(shí)

5. xhr.open

xhr.open方法有三個(gè)參數(shù)，含義如下：

1. method：表示HTTP請(qǐng)求的方法，比如GET、POST等。
2. url：表示請(qǐng)求的URL地址。
3. async：表示請(qǐng)求是否為異步，默認(rèn)為true，即異步請(qǐng)求。

如果第三個(gè)參數(shù)為true，則表示異步請(qǐng)求，即瀏覽器不需要等待服務(wù)器返回響應(yīng)即可繼續(xù)執(zhí)行后面的代碼。如果第三個(gè)參數(shù)為false，則表示同步請(qǐng)求，即瀏覽器需要等待服務(wù)器返回響應(yīng)后才能繼續(xù)執(zhí)行后面的代碼。

二、跨域

大家可以看看這篇什么是跨域(瀏覽器同源政策)，如何解決跨域

三、cookie、localStorage和sessionStorage

cookie、localStorage和sessionStorage都是用于在瀏覽器端存儲(chǔ)數(shù)據(jù)的技術(shù)。它們的用途、區(qū)別和大小如下所示：

	Cookie	localStorage	sessionStorage
用途	用于在瀏覽器和服務(wù)器之間傳遞數(shù)據(jù)，包括會(huì)話管理、持久性登錄狀態(tài)等	用于在瀏覽器端存儲(chǔ)較大量的數(shù)據(jù)，包括長(zhǎng)期保存的用戶配置、個(gè)人信息等	用于在瀏覽器端存儲(chǔ)臨時(shí)性的數(shù)據(jù)，僅在當(dāng)前會(huì)話有效
存儲(chǔ)位置	存儲(chǔ)在客戶端，會(huì)自動(dòng)隨HTTP請(qǐng)求發(fā)送到服務(wù)器	存儲(chǔ)在客戶端，不會(huì)自動(dòng)發(fā)送到服務(wù)器	存儲(chǔ)在客戶端，不會(huì)自動(dòng)發(fā)送到服務(wù)器
大小限制	最大可以存儲(chǔ)4KB的數(shù)據(jù)	最大可以存儲(chǔ)5MB的數(shù)據(jù)	最大可以存儲(chǔ)5MB的數(shù)據(jù)
生命周期	可設(shè)置過期時(shí)間，可以在瀏覽器重啟后仍然存在	除非被手動(dòng)清除，否則會(huì)一直存在	僅在當(dāng)前會(huì)話有效，關(guān)閉瀏覽器后會(huì)被自動(dòng)清除
訪問限制	對(duì)于每個(gè)具體的cookie，可以設(shè)置訪問限制（如域名、路徑等）	僅對(duì)于設(shè)置localStorage的網(wǎng)頁可訪問	僅對(duì)于設(shè)置sessionStorage的網(wǎng)頁可訪問
API	可以使用document.cookie來讀取和寫入cookie	可以使用localStorage對(duì)象的方法（如setItem、getItem、removeItem等）	可以使用sessionStorage對(duì)象的方法（如setItem、getItem、removeItem等）

需要注意的是，每個(gè)瀏覽器對(duì)cookie、localStorage和sessionStorage的實(shí)現(xiàn)可能會(huì)有一些細(xì)微的差異，例如存儲(chǔ)上限可能會(huì)略有不同。上述表格僅提供了一般情況下的常見規(guī)范。

四、http

1. http常見的狀態(tài)碼有哪些

http狀態(tài)碼

狀態(tài)碼	含義	說明
200	OK	請(qǐng)求成功
301	Moved Permanently	資源被永久移動(dòng)到新的URL
302	Found	資源被臨時(shí)移動(dòng)到新的URL
400	Bad Request	請(qǐng)求有誤，服務(wù)器無法處理
401	Unauthorized	請(qǐng)求需要身份驗(yàn)證
403	Forbidden	服務(wù)器拒絕該請(qǐng)求
404	Not Found	請(qǐng)求的資源不存在
500	Internal Server Error	服務(wù)器遇到錯(cuò)誤
502	Bad Gateway	服務(wù)器作為網(wǎng)關(guān)或代理時(shí)收到無效響應(yīng)
503	Service Unavailable	服務(wù)器暫時(shí)不可用
504	Gateway Timeout	服務(wù)器作為網(wǎng)關(guān)或代理時(shí)在等待上游服務(wù)器響應(yīng)時(shí)超時(shí)

2. http常見的header有哪些

常見的HTTP請(qǐng)求頭（Request Headers）如下所示：

Header字段	說明
Accept	告訴服務(wù)器可以發(fā)送的媒體類型
Accept-Charset	告訴服務(wù)器請(qǐng)求的字符集
Accept-Encoding	告訴服務(wù)器請(qǐng)求的內(nèi)容編碼方式 gzip
Accept-Language	告訴服務(wù)器請(qǐng)求的語言
Authorization	包含用戶憑證的認(rèn)證信息
Cache-Control	緩存機(jī)制指令
Connection	管理持久連接 keep-alive
Content-Length	請(qǐng)求體的大小
Content-Type	請(qǐng)求體的媒體類型
Cookie	之前保存的服務(wù)器發(fā)送的Cookie
Host	請(qǐng)求的主機(jī)名或IP地址
User-Agent	包含發(fā)送請(qǐng)求的用戶代理的信息
Referer	發(fā)送請(qǐng)求的頁面的URL
Origin	發(fā)起一個(gè)對(duì)跨域資源的請(qǐng)求

常見的HTTP響應(yīng)頭（Response Headers）如下所示：

Header字段	說明
Accept-Ranges	標(biāo)識(shí)服務(wù)器是否支持范圍請(qǐng)求
Cache-Control	緩存機(jī)制指令
Content-Encoding	響應(yīng)內(nèi)容的編碼方式 gzip
Content-Length	響應(yīng)的大小
Content-Type	響應(yīng)內(nèi)容的媒體類型
Set-Cookie	服務(wù)器發(fā)送的Cookie
Date	響應(yīng)生成的日期和時(shí)間
Etag	客戶端緩存檢查標(biāo)識(shí)符
Server	服務(wù)器標(biāo)識(shí)
Last-Modified	資源最后修改的時(shí)間
Location	資源被重新定位的URL
Access-Control-Allow-Origin	允許跨域資源共享的域
Access-Control-Allow-Headers	允許的跨域請(qǐng)求的自定義請(qǐng)求頭

請(qǐng)注意，這些是其中一些常見的HTTP頭部字段，實(shí)際上還有很多其他的頭部字段可以用于請(qǐng)求和響應(yīng)。

3. 什么是RestfulAPI

RESTful API 是一種使用 HTTP 協(xié)議和標(biāo)準(zhǔn) REST（Representational State Transfer）原則設(shè)計(jì)的 API，用于系統(tǒng)之間的通信。它允許客戶端通過 HTTP 方法（GET、POST、PUT、DELETE）對(duì)資源進(jìn)行操作，并使用 URL 定位資源。

與傳統(tǒng)的 API 相比，RESTful API 有以下區(qū)別：

1. 設(shè)計(jì)風(fēng)格：RESTful API 遵循資源的風(fēng)格，將每個(gè)資源都用一個(gè)唯一的 URI 表示，并使用合適的 HTTP 方法對(duì)其進(jìn)行操作。而傳統(tǒng)的 API 常常使用不同的 URI 和操作來表示不同的功能。
2. 狀態(tài)無關(guān)：RESTful API 是無狀態(tài)的，每個(gè)請(qǐng)求都應(yīng)該包含足夠的信息來處理請(qǐng)求，不依賴于之前的請(qǐng)求或狀態(tài)。傳統(tǒng)的 API 常常依賴于會(huì)話狀態(tài)。
3. 結(jié)果表現(xiàn)：RESTful API 返回的結(jié)果通常是資源的表現(xiàn)形式，比如 JSON 或 XML 格式的數(shù)據(jù)。傳統(tǒng)的 API 則常常返回各種包裝過的數(shù)據(jù)格式。
4. 緩存支持：RESTful API 支持緩存，可以減少網(wǎng)絡(luò)傳輸和服務(wù)器負(fù)載。傳統(tǒng)的 API 不一定具備緩存能力。
5. 可擴(kuò)展性：RESTful API 的設(shè)計(jì)使得系統(tǒng)易于擴(kuò)展和維護(hù)，因?yàn)樗褂脴?biāo)準(zhǔn)的 HTTP 協(xié)議和約束。傳統(tǒng)的 API 可能因?yàn)閷?shí)現(xiàn)的特定細(xì)節(jié)而難以擴(kuò)展。

總的來說，RESTful API 更加簡(jiǎn)單、靈活、可擴(kuò)展和易于使用，適用于不同平臺(tái)和系統(tǒng)的集成。

4. 描述一下http的緩存機(jī)制

HTTP的緩存機(jī)制是為了提高網(wǎng)頁加載速度，減輕服務(wù)器和網(wǎng)絡(luò)的負(fù)載。具體過程如下：

1. 客戶端發(fā)起HTTP請(qǐng)求時(shí)，服務(wù)器會(huì)在響應(yīng)頭部的Cache-Control字段或Expires字段中設(shè)置緩存策略。常見的緩存策略有：no-cache（不緩存）, no-store（不緩存和存儲(chǔ)）, public（可公開緩存）, private（僅個(gè)人緩存）等。

2. 客戶端收到服務(wù)端的響應(yīng)后，將響應(yīng)內(nèi)容以及緩存策略保存到本地緩存中。

3. 客戶端下一次請(qǐng)求相同資源時(shí)，先檢查本地緩存，如果緩存有效則直接從本地緩存中讀取響應(yīng)內(nèi)容，不再發(fā)送請(qǐng)求到服務(wù)器。

4. 當(dāng)緩存過期或者被標(biāo)記為無效時(shí)，客戶端會(huì)發(fā)送一個(gè)條件請(qǐng)求到服務(wù)器，其中會(huì)包含一個(gè)If-Modified-Since或者If-None-Match字段，用于告訴服務(wù)器上次緩存的響應(yīng)的最后修改時(shí)間或者ETag。

5. 服務(wù)器收到條件請(qǐng)求后，會(huì)根據(jù)請(qǐng)求中的If-Modified-Since或者If-None-Match字段與資源的最后修改時(shí)間或者ETag進(jìn)行比較。如果資源沒有更新，則返回狀態(tài)碼304 Not Modified，客戶端可以繼續(xù)使用本地緩存；如果資源已經(jīng)更新，則返回新的響應(yīng)內(nèi)容。

6. 當(dāng)服務(wù)器返回新的響應(yīng)內(nèi)容時(shí)，客戶端會(huì)將新的響應(yīng)內(nèi)容和緩存策略更新到本地緩存中，以備下一次使用。

需要注意的是，客戶端和服務(wù)器之間的緩存是相互獨(dú)立的，服務(wù)器可以通過在響應(yīng)頭中設(shè)置Cache-Control字段或Expires字段來控制客戶端的緩存策略，而客戶端也可以通過設(shè)置請(qǐng)求頭中的Cache-Control字段來控制服務(wù)器的緩存策略。

HTTP的緩存機(jī)制可以用以下圖示來描述：

                 ┌───────┐            ┌───────┐┌────?│ Client│?──────────┤ Server││     └───────┘            └───────┘│           ↑                    │├───────────┘                    ││                                │▼                                ▼┌─────────────┐               ┌───────────────────┐│    Cache    │               │     Origin        ││    Store    │?─────?Cache-Control: max-age     │└─────────────┘               └───────────────────┘▲                                ▲│                                │├───────────┐                    │ Cache Miss│           ▼                    ││     ┌───────┐            ┌───────┐└─────│ Client│?──────────┤ Server│└───────┘            └───────┘Cache Hit

在這個(gè)圖示中：

1. Client發(fā)起HTTP請(qǐng)求，請(qǐng)求會(huì)經(jīng)過緩存（Cache）。
2. 如果緩存中沒有對(duì)應(yīng)的資源，緩存會(huì)將請(qǐng)求發(fā)送給Server。
3. Server響應(yīng)請(qǐng)求，并在響應(yīng)頭中攜帶Cache-Control指令，例如：max-age指定緩存的有效時(shí)間。
4. 緩存將來自Server的響應(yīng)存儲(chǔ)在Cache Store中，并將響應(yīng)返回給Client。
5. 當(dāng)Client再次請(qǐng)求相同的資源時(shí)，請(qǐng)求會(huì)首先發(fā)送到緩存。
6. 如果緩存中存在對(duì)應(yīng)資源且仍在有效期內(nèi)（未過期），則緩存命中，緩存將直接返回該資源給Client。
7. 如果緩存中不存在對(duì)應(yīng)資源或已過期，緩存會(huì)重新向Server發(fā)起請(qǐng)求，重復(fù)上述過程。

這種緩存機(jī)制可以減少對(duì)服務(wù)器的請(qǐng)求，提高響應(yīng)速度，減輕服務(wù)器負(fù)載。

5. https

HTTPS（Hypertext Transfer Protocol Secure）是HTTP協(xié)議的安全版本，用于保護(hù)網(wǎng)絡(luò)通信的安全性。HTTPS通過使用SSL（Secure Sockets Layer）或TLS（Transport Layer Security）協(xié)議來加密HTTP通信內(nèi)容，從而防止數(shù)據(jù)被竊聽、篡改或偽造。

在HTTPS通信中，客戶端與服務(wù)器之間建立安全的加密通道，確保數(shù)據(jù)的隱私和完整性。它使用SSL或TLS協(xié)議進(jìn)行加密，以保護(hù)數(shù)據(jù)傳輸過程中的機(jī)密信息，例如用戶敏感數(shù)據(jù)、登錄憑證、付款信息等。

HTTPS的工作原理大致如下：

1. 客戶端發(fā)起HTTPS請(qǐng)求時(shí)，服務(wù)器會(huì)將自己的數(shù)字證書發(fā)送給客戶端。
2. 客戶端收到服務(wù)器的數(shù)字證書后，會(huì)驗(yàn)證證書的合法性和可信任性。若驗(yàn)證通過，則生成一個(gè)隨機(jī)的對(duì)稱密鑰，并使用服務(wù)器的公鑰對(duì)該密鑰進(jìn)行加密。
3. 客戶端將加密后的對(duì)稱密鑰發(fā)送給服務(wù)器。
4. 服務(wù)器收到加密的對(duì)稱密鑰后，使用自己的私鑰進(jìn)行解密得到對(duì)稱密鑰。
5. 客戶端和服務(wù)器之間使用對(duì)稱密鑰進(jìn)行加密和解密通信內(nèi)容。

HTTPS可以提供以下安全保護(hù)：

1. 數(shù)據(jù)加密：通過SSL/TLS協(xié)議將通信內(nèi)容加密，防止數(shù)據(jù)被竊聽。
2. 數(shù)據(jù)完整性驗(yàn)證：使用數(shù)字簽名保證數(shù)據(jù)的完整性，防止數(shù)據(jù)被篡改。
3. 身份驗(yàn)證：通過數(shù)字證書驗(yàn)證服務(wù)器的身份，防止偽造的服務(wù)器進(jìn)行攻擊。

使用HTTPS可以有效提高網(wǎng)絡(luò)通信的安全性，特別是在涉及敏感信息傳輸?shù)膱?chǎng)景，如在線支付、個(gè)人信息提交等。