2018最新前端面試題七

這次帶給大家2018最新前端面試題，我們知道在前端工作中面試是必不可少的一部分，這次的前端面試常考問題分類整理匯總就是來幫助大家度過前端面試著一大難關。一起來看一下。

【相關推薦：前端面試題（2020）】

一、什麼是跨領域資源分享 (CORS)？它用於解決什麼問題？

預設情況下，為預防某些而已行為，瀏覽器的XHR物件只能存取來自同一個網域中的資源。但我們在日常實際開發中，常常會遇到跨域請求的需求，因此就出現了一種跨域請求的方案：CORS（Cross-Origin Resource Sharing）跨域資源共享。 CORS背後的原理是：使用自定的HTTP頭部與伺服器溝通，從而由伺服器決定回應是否成功。
如何使用CORS？
    使用CORS需要客戶端和服務端兩者配合。
    1、客戶端如何啟動CORS跨域請求？
    目前在大多數瀏覽器下(CORS在各瀏覽器下支援情況)，都原生支援CORS，程式碼編寫時和同域的請求差不多，只需要在xhr.open()的時候傳入絕對URL即可。例如：

var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function () {    if(xhr.readyState == 4){        if(xhr.status >= 200 && xhr.status < 300 || xhr.status == 304){            console.log(xhr.responseText)
        }else {            console.log(&#39;err&#39; + xhr.status);
        }
    }
};
xhr.open(&#39;get&#39;,&#39;http://www.xxx.com/api/something/&#39;,true);
xhr.send(null);

   這樣就可以發送一個跨域請求了，但是如果只是如上面範例程式碼一樣發送的話會報錯，因為伺服器並未設定允許我們這個請求，因此CORS還需要服務端來配合。
   2、伺服器如何允許客戶的CORS跨域請求？
   伺服器只需要在回應頭部中設定Access-Control-Allow-Origin即可讓客戶端存取。
   假設客戶端的網域名稱是http://www.xxx.com，那麼服務端只要在Access-Control-Allow-Origin的設定中含有http://www.xxx.com，那麼這個CORS請求即可成功。如果Access-Control-       Allow-Origin設定為*，任意網域都可以存取這個服務端，但是為了安全起見，一般並不建議這樣做。

相信看了本文案例你已經掌握了方法，更多精彩請關注php中文網其它相關文章！

相關閱讀：

2018最新前端面試題四

2018最新前端面試題五

#2018最新前端面試題六

以上是2018最新前端面試題七的詳細內容。更多資訊請關注PHP中文網其他相關文章！