關於Ajax和websocket的區別以及使用場景！

在咱們平常使用的互聯網產品中，不少都是先後端數據的交互來完成的，說到數據交互就不得不提Ajax和websocket，它們但是數據交互的利器，那麼它們分別是什麼？websocket與Ajax輪詢的區別又是什麼？它們分別的使用場景有哪些？

Ajax是什麼？

Ajax，即異步JavaScript和XML，是一種建立交互式網頁應用的網頁開發技術。經過在後臺與服務器進行少許數據交換，Ajax可使網頁實現異步更新，這意味着能夠在不從新加載整個網頁的狀況下，對網頁的部分進行加載更新。

Ajax 的優勢在於它在瀏覽器與web服務器之間使用異步數據傳輸（HTTP請求），不阻塞用戶，核心對象是XMLHTTPRequest。經過這個對象， js可在不從新加載頁面的狀況下與web服務器交換數據 。

websocket是什麼？

websocket是HTML5一種新的協議，實現了瀏覽器與服務器全雙工通訊。其本質是：先經過HTTP/HTTPS協議進行握手後建立一個用於交換數據的TCP鏈接，服務端與客戶端經過此TCP鏈接進行實時通訊。

websocket最大的優勢在於——服務器和瀏覽器能夠在給定的時間範圍內的任意時刻，互相推送消息。在創建鏈接以後，服務器能夠主動傳送數據給瀏覽器。Ajax與websocket最大的不一樣在於： Ajax須要客戶端發起請求，websocket服務器和客戶端能夠互相實時推送消息。

Ajax輪詢和websocket的區別

實現瀏覽器與服務器的實時數據交互，能夠經過創建websocket，也能夠經過Ajax輪詢的方式。

瞭解了Ajax和websocket的基本概念，那麼咱們平時會在哪些應用場景應用到這兩種技術呢？

Ajax的應用場景 Ajax的特色在於異步交互，動態更新web頁面，所以Ajax的適用範圍是交互較多，頻繁讀取數據的web應用。

Ajax應用場景：

1.用Ajax進行表單數據驗證

在填寫表單內容時，須要保證數據的惟一性（例如新用戶註冊填寫的用戶名），所以必須對用戶輸入的內容進行數據驗證。

使用Ajax技術，能夠由XMLHttpRequest對象發出驗證請求，根據返回的HTTP響應判斷驗證是否成功，整個過程不須要彈出新窗口，也不須要將整個頁面提交到服務器，快速而又不會加劇服務器負擔。

2.按需取數據

在web應用中，常常會用到分類樹或樹形結構，例如部門結構，文件的分類結構等。

Ajax技術是這樣實現樹形結構的：

在初始化頁面時，只獲取第一級子分類的數據並顯示； 當用戶點開一級分類的第一節點時，頁面會經過Ajax向服務器請求當前分類所屬的二級子分類的全部數據； 若是再請求已經呈現的二級分類的某一節點時，再次向服務器請求當前分類所屬的三級子分類的全部數據，以此類推。 頁面會根據用戶的操做向服務器請求所須要的數據，這樣就不會存在數據的冗餘，減小了數據下載總量。同時，更新頁面時不須要從新加載所有內容，只更新須要更新的那部份內容便可，大大縮短了用戶的等待時間。

3.自動更新頁面

web應用中有不少數據的變化是實時的，例如：最新的新聞，天氣預報以及聊天室等等。在Ajax出現以前，用戶爲了即便了解相應的內容必須不斷刷新頁面，查看是否有新的內容變化，或者頁面自己實現定時刷新的功能。

應用Ajax技術能夠改善這種這種狀況，頁面加載之後，會經過Ajax在後臺進行定時的輪詢，向服務器發送請求，查看是否有最新的消息（固然這種狀況是有弊端的，上面也說到了）。若是有則將新的數據下載而且在頁面上進行動態的更新，經過必定的方式通知用戶。

websocket的應用場景

決定是否須要使用websocket技術的方法其實很簡單：

你的產品須要提供多個用戶相互交流的功能嗎？ 你的產品須要展現服務器端常常變更的數據嗎？ 若是回答都是確定的，那麼你的產品中就要應用websocket技術了。

經常使用的應用場景以下：

1.社交類應用

對社交類的應用的一個好處之處就是——可以即時的知道你的朋友正在作什麼？用戶是不會想要在數分鐘以後，才能知道一個家庭成員在羣裏發送的紅包或者一個朋友給你發的消息。用戶是在線的，因此用戶收到的消息應該是實時的。

2.股票基金類應用的價格

金融界瞬息萬變——幾乎是每毫秒都在發生變化，過期的信息就能致使損失。當咱們打開一個股票或基金類應用時，咱們想要知道產品實時的價格，而不是10秒前的數據。使用websocket能夠實時更新這些數據變化而不須要等待。

3.基於位置的應用

愈來愈多的基於位置的應用，都是借用移動設備的GPS功能來實現的。若是一直記錄用戶的位置，就能夠收集到更加細緻化的數據。若是須要實時的更新網絡數據儀表盤(好比：說運動員的教練須要查看這些數據)，借用websocket能夠作到讓數據實時刷新。

4.在線教育類應用

在線教育是學習的不錯方式，能夠和老師以及其餘同窗一塊兒交流。websocket技術能夠實現多媒體聊天、文字聊天等功能。

總結

Ajax通常會應用在交互較多，頻繁讀取數據的web應用中。

websocket通常會應用在須要提供多個用戶相互交流，或須要實時的展現服務端變更的數據這兩種狀況。瞭解了這兩項技術，在設計到相關產品功能時，就能應對自如了。