1. 說一下http和https？

https的SSL加密是在傳輸層實現的。

(1)http和https的基本概念

http: 超文字傳輸協議，是網際網路上應用最為廣泛的一種網路協議，是一個客戶端和伺服器端請求和應答的標準（TCP），用於從WWW伺服器傳輸超文字到本地瀏覽器的傳輸協議，它可以使瀏覽器更加高效，使網路傳輸減少。

https: 是以安全為目標的HTTP通道，簡單講是HTTP的安全版，即HTTP下加入SSL層，HTTPS的安全基礎是SSL，因此加密的詳細內容就需要SSL。

https協議的主要作用是：建立一個資訊保安通道，來確保陣列的傳輸，確保網站的真實性。

(2)http和https的區別？

http傳輸的資料都是未加密的，也就是明文的，網景公司設定了SSL協議來對http協議傳輸的資料進行加密處理，簡單來說https協議是由http和ssl協議構建的可進行加密傳輸和身份認證的網路協議，比http協議的安全性更高。
主要的區別如下：

Https協議需要ca證書，費用較高。

http是超文字傳輸協議，資訊是明文傳輸，https則是具有安全性的ssl加密傳輸協議。

使用不同的連結方式，埠也不同，一般而言，http協議的埠為80，https的埠為443

http的連線很簡單，是無狀態的；HTTPS協議是由SSL+HTTP協議構建的可進行加密傳輸、身份認證的網路協議，比http協議安全。

(3)https協議的工作原理

客戶端在使用HTTPS方式與Web伺服器通訊時有以下幾個步驟，如圖所示。

客戶使用https url訪問伺服器，則要求web 伺服器建立ssl連結。

web伺服器接收到客戶端的請求之後，會將網站的證書（證書中包含了公鑰），返回或者說傳輸給客戶端。

客戶端和web伺服器端開始協商SSL連結的安全等級，也就是加密等級。

客戶端瀏覽器通過雙方協商一致的安全等級，建立會話金鑰，然後通過網站的公鑰來加密會話金鑰，並傳送給網站。

web伺服器通過自己的私鑰解密出會話金鑰。

web伺服器通過會話金鑰加密與客戶端之間的通訊。

(4)https協議的優點

使用HTTPS協議可認證使用者和伺服器，確保資料傳送到正確的客戶機和伺服器；

HTTPS協議是由SSL+HTTP協議構建的可進行加密傳輸、身份認證的網路協議，要比http協議安全，可防止資料在傳輸過程中不被竊取、改變，確保資料的完整性。

HTTPS是現行架構下最安全的解決方案，雖然不是絕對安全，但它大幅增加了中間人攻擊的成本。

谷歌曾在2014年8月份調整搜尋引擎演算法，並稱“比起同等HTTP網站，採用HTTPS加密的網站在搜尋結果中的排名將會更高”。

(5)https協議的缺點

https握手階段比較費時，會使頁面載入時間延長50%，增加10%~20%的耗電。

https快取不如http高效，會增加資料開銷。

SSL證書也需要錢，功能越強大的證書費用越高。

SSL證書需要繫結IP，不能再同一個ip上繫結多個域名，ipv4資源支援不了這種消耗。

2. TCP和UDP的區別？

（1）TCP是面向連線的，udp是無連線的即傳送資料前不需要先建立連結。

（2）TCP提供可靠的服務。也就是說，通過TCP連線傳送的資料，無差錯，不丟失，不重複，且按序到達;UDP盡最大努力交付，即不保證可靠交付。 並且因為tcp可靠，面向連線，不會丟失資料因此適合大資料量的交換。

（3）TCP是面向位元組流，UDP面向報文，並且網路出現擁塞不會使得傳送速率降低（因此會出現丟包，對實時的應用比如IP電話和視訊會議等）。

（4）TCP只能是1對1的，UDP支援1對1,1對多。

（5）TCP的首部較大為20位元組，而UDP只有8位元組。

（6）TCP是面向連線的可靠性傳輸，而UDP是不可靠的。

3. HTTP請求的方式，HEAD方式？

head：類似於get請求，只不過返回的響應中沒有具體的內容，使用者獲取報頭

options：允許客戶端檢視伺服器的效能，比如說伺服器支援的請求方式等等。

4. 補充400和401、403狀態碼？

(1)400狀態碼：請求無效

產生原因：

前端提交資料的欄位名稱和欄位型別與後臺的實體沒有保持一致

前端提交到後臺的資料應該是json字串型別，但是前端沒有將物件JSON.stringify轉化成字串。

解決方法：

對照欄位的名稱，保持一致性

將obj物件通過JSON.stringify實現序列化

(2)401狀態碼：當前請求需要使用者驗證

(3)403狀態碼：伺服器已經得到請求，但是拒絕執行

5. Fetch傳送2次請求的原因？

原因很簡單，因為你用fetch的post請求的時候，導致fetch 第一次傳送了一個Options請求，詢問伺服器是否支援修改的請求頭，如果伺服器支援，則在第二次中傳送真正的請求。

6. Cookie、sessionStorage、localStorage的區別？

共同點：都是儲存在瀏覽器端，並且是同源的

Cookie：cookie資料始終在同源的http請求中攜帶（即使不需要），即cookie在瀏覽器和伺服器間來回傳遞。而sessionStorage和localStorage不會自動把資料發給伺服器，僅在本地儲存。cookie資料還有路徑（path）的概念，可以限制cookie只屬於某個路徑下,儲存的大小很小隻有4K左右。 （key：可以在瀏覽器和伺服器端來回傳遞，儲存容量小，只有大約4K左右）

sessionStorage：僅在當前瀏覽器視窗關閉前有效，自然也就不可能持久保持，localStorage：始終有效，視窗或瀏覽器關閉也一直儲存，因此用作持久資料；cookie只在設定的cookie過期時間之前一直有效，即使視窗或瀏覽器關閉。（key：本身就是一個回話過程，關閉瀏覽器後消失，session為一個回話，當頁面不同即使是同一頁面開啟兩次，也被視為同一次回話）

localStorage：localStorage 在所有同源視窗中都是共享的；cookie也是在所有同源視窗中都是共享的。（key：同源視窗都會共享，並且不會失效，不管視窗或者瀏覽器關閉與否都會始終生效）

補充說明一下cookie的作用：

儲存使用者登入狀態。例如將使用者id儲存於一個cookie內，這樣當用戶下次訪問該頁面時就不需要重新登入了，現在很多論壇和社群都提供這樣的功能。 cookie還可以設定過期時間，當超過時間期限後，cookie就會自動消失。因此，系統往往可以提示使用者保持登入狀態的時間：常見選項有一個月、三個 月、一年等。

跟蹤使用者行為。例如一個天氣預報網站，能夠根據使用者選擇的地區顯示當地的天氣情況。如果每次都需要選擇所在地是煩瑣的，當利用了cookie後就會顯得很人性化了，系統能夠記住上一次訪問的地區，當下次再開啟該頁面時，它就會自動顯示上次使用者所在地區的天氣情況。因為一切都是在後 臺完成，所以這樣的頁面就像為某個使用者所定製的一樣，使用起來非常方便定製頁面。如果網站提供了換膚或更換佈局的功能，那麼可以使用cookie來記錄使用者的選項，例如：背景色、解析度等。當用戶下次訪問時，仍然可以儲存上一次訪問的介面風格。

7. Cookie如何防範XSS攻擊？

XSS（跨站指令碼攻擊）是指攻擊者在返回的HTML中嵌入javascript指令碼，為了減輕這些攻擊，需要在HTTP頭部配上，set-cookie：

httponly-這個屬性可以防止XSS,它會禁止javascript指令碼來訪問cookie。

secure - 這個屬性告訴瀏覽器僅在請求為https的時候傳送cookie。

結果應該是這樣的：Set-Cookie=<cookie-value>

8. Cookie和Session的區別？

HTTP是一個無狀態協議，因此Cookie的最大的作用就是儲存sessionId用來唯一標識使用者

9. AddEventListener引數？

addEventListener(event, function, useCapture)

其中，event指定事件名；function指定要事件觸發時執行的函式；useCapture指定事件是否在捕獲或冒泡階段執行。