寫下此文，是因為本人作為前端小白，經常遇到同樣小白的後端，常常不得不三番五次科普一些前端的基礎知識，特此做些總結，也方便有下次的話，直接拿出來給對方看。

1. 什麽是ajax

對於網絡請求分類的維度有很多種，有一種就是這個請求發送出去是否需要刷新頁面。比如form表單，比如直接從瀏覽器地址欄輸入地址請求，這樣的請求都是伴隨著頁面刷新的。而ajax，全稱異步js和xml，簡單來說，就是前端向後端發送請求，無需刷新頁面，這在註重用戶體驗的前端領域，是極為寶貴的。不過有利就有弊，ajax很方便，但也有很多限制。

對於ajax，後端並不需要了解多麽深入，只需要知道有這麽一回事，同時清楚，現在前後端交互，尤其是在前後端分離的情況下，ajax是使用最普遍的。

2. 跨域

ajax有很多限制，在前後端分離之後，首當其中的就是跨域問題。在以前的諸如SSH框架下搭建的項目，因為前後端都在一起，是較少見跨域這種情況的，因此對於跨域的不了解，是後端小白們比較常見的問題。

一個網絡請求，url格式通常是：protocol：//ip:port 。所謂跨域，就是當前頁面的訪問地址（也就是顯示在瀏覽器地址欄裏的url）和ajax請求的後端地址在protocol,ip,port三項中至少有一項不一樣。

如果出現了跨域ajax請求，因為瀏覽器的同源策略限制，如果不做任何處理，那麽請求是不能成功的。對於跨域訪問的解決方案有很多，比如jsonp,代理等方式，不過常用的還是CORS。

使用CORS方案，後端要做的就是在請求響應頭裏添加‘Access-Control-Allow-Origin‘頭，其值表示允許訪問的源地址。常用的策略是獲取request裏的origin值，然後驗證白名單（或黑名單），通過則將origin值賦給‘Access-Control-Allow-Origin‘響應頭。測試的話，也可以設為*，表示允許來自任何源的跨域請求。

3. OPTIONS請求

OPTIONS請求即預檢請求，當一個請求不是簡單請求時，瀏覽器會先發送一個預檢請求，來確認是否能夠請求成功，當能請求成功後，才會發送“真正”的請求。

當使用跨域ajax的時候，因為會設置各種請求頭信息，這樣的請求就不是簡單請求，這時就會出現預檢請求的情況，在後端看來就會發現明明前端只請求了一次，卻收到兩次請求的情況，如果處理不當，就會出錯。PS：有些框架可能會默認處理OPTIONS請求。

4.重定向

在那個後端兼職的前端的古老年代，很多邏輯都是後端幫前端來做的，因此常常一言不合就302重定向。

現在，後端師傅們，你們必須知道一點，不要試圖操作前端了，你們唯一能做的就是告訴前端，你們想要做什麽，至於幫不幫你做，得由我們前端說了算。

當然，這麽說並不是我們前端傲嬌，而是ajax是不允許302重定向的。這個問題比較常見的是一些老項目，要采用前後端進行重構，後端則還是原來那一套，這時就會出現各種返回302的情況。

比如本人就遇到多次這樣的問題。我們公司的登錄認證是采用sso形式的，很多老項目都是當請求來時，驗證cookie，不通過，直接上302跳SSO服務。而這樣的代碼一般都是通用的，我們的小白後端或者是直接繼承了前輩的項目，或者是復制的以前的項目代碼而不知這個隱蔽的情況。當我試圖請求不成功，發現302後，我跟他說不能重定向，他一臉懵逼的搖頭，我沒重定向啊（有的還會問什麽是重定向，這種情況我只能甩他一個百度百科）。直到我看到響應頭裏的Location包含著sso等字樣，我不得不長嘆一口氣，告訴他認證那塊呢，同誌！

結語

講道理，應該還有很多，只是今天暫時只遇到了這麽些，以後想起了再補充吧。

寫完之後，發現有不少吐槽我們後端同學的地方，突然覺得背離了初衷，貌似不方便直接拿出來給他們看啊。

前後端分離後，後端師傅們應該知道的一些基本前端知識