一、網路請求
1、dns解析：
（1） 瀏覽器會首先檢視本地硬碟的 hosts 檔案，看看其中有沒有和這個網域名稱對應的規則，如果有的話就直接使用 hosts 檔案裡面的 ip 位址。
（2） 如果在本地的 hosts 檔案沒有能夠找到對應的 ip 位址，瀏覽器會發出乙個 dns請求到本地dns伺服器
（ 網路接入伺服器商)， 本地dns伺服器會首先查詢它的快取記錄，如果快取中有此條記錄，就可以直接返回結果，此過程是遞迴的方式進行查詢。如果沒有，本地dns伺服器還要向dns根伺服器進行查詢。
（3） 根dns伺服器沒有記錄具體的網域名稱和ip位址的對應關係，而是告訴本地dns伺服器，你可以到域伺服器上去繼續查詢，並給出域伺服器的位址
（4） 本地dns伺服器繼續向域伺服器發出請求， 域伺服器收到請求之後，也不會直接返回網域名稱和ip位址的對應關係，而是告訴本地dns伺服器， 網域名稱的解析伺服器的位址。
（5） 本地dns伺服器向網域名稱的解析伺服器發出請求，這時就能收到乙個網域名稱和ip位址對應關係，本地dns伺服器不僅要把ip位址返回給使用者電腦，還要把這個對應關係儲存在快取中，以備下次別的使用者查詢時，可以直接返回結果，加快網路訪問。
2.http請求方法：常用的post,get, 不常用的還有 put 和 delete 、head、option以及 trace 方法，一般的瀏覽器只能發起 get 或者 post 請求。
3.tcp三次握手：
（1） 客戶端a將標誌位syn置為1,隨機產生乙個值為seq=j（j的取值範圍為=1234567）的資料報到伺服器，客戶端a進入syn_sent狀態，等待服務端b確認；
（2） 服務端b收到資料報後，通過標誌位syn=1知道客戶端a請求建立連線，服務端b將標誌位syn和ack都置為1，ack=j+1，隨機產生乙個值seq=k，並將該資料報傳送給客戶端a以確認連線請求，服務端b進入syn_rcvd狀態。
（3） 客戶端a收到確認後，檢查ack是否為j+1，ack是否為1，如果正確則將標誌位ack置為1，ack=k+1，並將該資料報傳送給服務端b，服務端b檢查ack是否為k+1，ack是否為1，如果正確則連線建立成功，客戶端a和服務端b進入established狀態，完成三次握手，隨後客戶端a與服務端b之間可以開始傳輸資料了。
目的：防止已經失效的連線再次請求報文，而伺服器照常響應，客戶端無響應，因此照成伺服器資源浪費
4.tcp四次揮手
（1） 客戶端傳送乙個fin，用來關閉客戶端到服務端的資料傳送，客戶端進入fin_wait_1狀態。
（2） 服務端收到fin後，傳送乙個ack給
客戶端，確認序號為收到序號+1（與syn相同，乙個fin占用乙個序號），服務端進入close_wait狀態
（3） 服務端傳送乙個fin，用來關閉服務端到客戶端的資料傳送，服務端進入last_ack狀態。
（4） 客戶端收到fin後，客戶端進入time_wait狀態，接著傳送乙個ack給服務端，確認序號為收到序號+1，服務端進入closed狀態，完成四次揮手。
5. nginx反向**（向客戶端隱藏服務）
當**訪問量非常大，**越來越慢，一台伺服器已經不夠用了。於是將同乙個應用部署在多台伺服器上，將大量使用者的請求分配給多台機器處理。此時，客戶端不是直接通過http協議訪問某**應用伺服器，而是先請求到nginx，nginx再請求應用伺服器，然後將結果返回給客戶端，這裡nginx的作用是反向**伺服器。同時也帶來了乙個好處，其中一台伺服器萬一掛了，只要還有其他伺服器正常執行，就不會影響使用者使用。
7.跨域問題
（1）原因：同源政策
a網頁設定的 cookie，b網頁不能開啟，除非這兩個網頁"同源"。所謂"同源"指的是"三個相同"：協議，網域名稱，埠相同。「同源政策」的目的是為了保護使用者資訊，防止**惡意竊取資料。限制主要在以下三個方面：cookie，local storage，index db無法獲取；dom無法獲得；ajax請求不能傳送；
（2）解決方法
var popup = window.open('', 'title');
popup.postmessage('hello world!', '')
父視窗和子視窗都可以通過message事件，監聽對方的訊息， message事件的事件物件event，提供以下三個屬性：event.source：傳送訊息的視窗；event.origin: 訊息發向的**；event.data: 訊息內容
window.addeventlistener('message', function(e) ,false);
子視窗可以使用event.source引用父視窗傳送訊息：
window.addeventlistener('message', receivemessage);
function receivemessage(event)
event.origin可以過濾不是發給本視窗的訊息
websocket是一種通訊協議，使用ws://（非加密）和wss://（加密）作為協議字首。該協議不實行同源政策，只要伺服器支援，就可以通過它進行跨源通訊.websocket的請求頭中origin欄位表示請求傳送的請求源，伺服器可以通過這個字段判斷是否允許此次通訊。
它是w3c標準，是跨源ajax請求的根本解決方法。相比jsonp只能發get請求，cors允許任何型別的請求。
二、websocket
１、使用websocket的原因
http協議不支援持久連線，且通訊只能由客戶端發起請求，伺服器返回查詢結果，無法由服務端主動向客戶端推送訊息。雖然http１.１做出了改進，使用keep－alive，可以傳送多個request，接收多個response，但是乙個request只能對應乙個response，response依然是被動的。
２．websocket的特點
3.websocket使用
var ws = new websocket("ws:")
connecting：值為0表示正在連線
open：值為1表示連線成功，可以進行通訊
closing值為2，表示正在關閉、
closed值為3表示已經關閉或者建立連線失敗
前端知識整理
如果修改的是left,top.需要加上position.例如 tooltip css 查詢原因才發現跟元素的定位型別有關，改為 tooltip css 在沒有宣告doctype的ie中，瀏覽器顯示視窗大小只能以下獲取 document.body.offsetwidth document.body.o...
前端知識整理
目錄 1.vue 基礎 2.vue 高階 mvvm vm的資料監控 vue生命週期，即日常使用。全域性鉤子函式 vue常用指令 雙向資料繫結 觀察訂閱模式解析 伺服器端渲染 ssr 動態路由 vue cli 多頁面配置 vue cli webpack 增量更新配置 vue cli 首頁載入優化 1....
前端整理（一）
visibility hidden 為隱藏的物件保留其物理空間 html元素 物件 僅僅是在視覺上看不見 完全透明 而它所佔據的空間位置仍然存在。display none 不為被隱藏的物件保留其物理空間 html元素 物件 的寬度 高度等各種屬性值都將 丟失 網域名稱解析 發起tcp的3次握手 建立...