ajax高頻面試問(wèn)題總結(jié)

來(lái)源 | https://www.cnblogs.com/chenfairy/p/14156294.html??

一、什么是 ajax?

它是一種異步請(qǐng)求數(shù)據(jù)的web開(kāi)發(fā)技術(shù)，它可以在不提交整個(gè)頁(yè)面的情況下，向服務(wù)器發(fā)送請(qǐng)求，實(shí)現(xiàn)頁(yè)面的局部刷新。

目的：可以帶來(lái)更好的用戶體驗(yàn)，按需獲取數(shù)據(jù)，節(jié)約帶寬資源

二、ajax的原理?

首先舉個(gè)例子：假如領(lǐng)導(dǎo)想讓小王匯報(bào)一下工作，就委托秘書(shū)去叫小王，自己接著做其他事情，直到秘書(shū)告訴他小王已經(jīng)到了，最后小王和領(lǐng)導(dǎo)匯報(bào)工作

ajax請(qǐng)求數(shù)據(jù)流程與之類(lèi)似，其中最核心的依賴是瀏覽器提供的XMLHttpRequest對(duì)象，它扮演的角色相當(dāng)于秘書(shū)，使得瀏覽器可以發(fā)出請(qǐng)求和接收響應(yīng)。瀏覽器接著做其他事情，等接收到XHR返回來(lái)的數(shù)據(jù)后再渲染頁(yè)面

三、ajax請(qǐng)求數(shù)據(jù)的過(guò)程?

創(chuàng)建一個(gè)'XMLHttpRequest'異步調(diào)用對(duì)象。

創(chuàng)建一個(gè)新的HTTP請(qǐng)求,并指定請(qǐng)求的方法、URL及驗(yàn)證信息。

設(shè)置響應(yīng)HTTP請(qǐng)求狀態(tài)變化的函數(shù)。

發(fā)送HTTP請(qǐng)求。

獲取異步調(diào)用返回的數(shù)據(jù)。

使用JavaScript和DOM實(shí)現(xiàn)局部刷新。

var xhr = new XMLHttpRequest();   // 初始化請(qǐng)求對(duì)象xhr.open("get/post", "路徑", "true/false");   // 設(shè)置請(qǐng)求方式，請(qǐng)求地址 ，異步(true  默認(rèn)的)和同步(false  強(qiáng)烈不推薦使用，已被棄用)xhr.send();xhr.onreadystatechange = function () {  //  2 = 加載完畢（loaded），請(qǐng)求已接收頭信息；3 = 交互 ，請(qǐng)求處理中，已接收主體信息；4 = 完成（complete），響應(yīng)已完成(返回響應(yīng)結(jié)果：成功/重定向/不存在/服務(wù)器有問(wèn)題)       if (xhr.readyState == 4 && xhr.status == 200) {   // xhr.readyState：請(qǐng)求的狀態(tài)；xhr.status：服務(wù)器返回的響應(yīng)狀態(tài)（成功 200，重定向 300，不存在 400，服務(wù)器有問(wèn)題 500)            var result = jsON.parse(xhr.responseText);       } }

四、ajax都有哪些優(yōu)點(diǎn)和缺點(diǎn)？

ajax的優(yōu)點(diǎn)：

最大的優(yōu)點(diǎn)是頁(yè)面無(wú)刷新，用戶的體驗(yàn)非常好

使用異步方式與服務(wù)器通信，具有更加迅速的響應(yīng)能力

ajax的原則是“按需取數(shù)據(jù)”，可以最大程度的減少冗余請(qǐng)求，減輕服務(wù)器和帶寬的負(fù)擔(dān)

基于標(biāo)準(zhǔn)化并被廣泛支持的技術(shù)，不需要下載插件或者小程序

ajax的缺點(diǎn)

ajax不支持瀏覽器back按鈕

安全問(wèn)題 ，ajax暴露了與服務(wù)器交互的細(xì)節(jié)

對(duì)搜索引擎的支持比較弱

破壞了程序的異常機(jī)制

五、http常見(jiàn)狀態(tài)碼有哪些？

HTTP協(xié)議狀態(tài)碼表示的意思主要分為五類(lèi)，大體是:

1××：保留
2××：表示請(qǐng)求成功地接收
3××：為完成請(qǐng)求客戶需進(jìn)一步細(xì)化請(qǐng)求
4××：客戶錯(cuò)誤
5××：服務(wù)器錯(cuò)誤

六、ajax的幾種請(qǐng)求方式以及優(yōu)缺點(diǎn)？

常見(jiàn)的請(qǐng)求方式：get post delete put

get參數(shù)通過(guò)url傳遞，post放在request body中

get方式發(fā)送數(shù)據(jù)時(shí)，參數(shù)數(shù)據(jù)隊(duì)列在url中是可見(jiàn)的，post不可見(jiàn)

get傳輸速率比較快，post比較慢

get保密性低，post保密性高

get傳遞的參數(shù)是有長(zhǎng)度限制的，post沒(méi)有

get請(qǐng)求只能進(jìn)行url編碼，而post支持多種編碼方式

七、什么是同源策略以及跨域是什么？

同源策略：防止 JavaScript 發(fā)起跨域請(qǐng)求，源被定義為協(xié)議、主機(jī)名和端口號(hào)的組合，下面這個(gè)圖詳細(xì)的解釋了同源。

跨域：基于瀏覽器的同源策略，只有當(dāng)協(xié)議、端口、和域名都相同的頁(yè)面才具有相同的源。只要有一個(gè)不同，就產(chǎn)生跨域問(wèn)題。

解決方法：

jsonp，允許 script 加載第三方資源。

nginx反向代理（nginx 服務(wù)內(nèi)部配置 Access-Control-Allow-Origin *）。

cors 前后端協(xié)作設(shè)置請(qǐng)求頭部，Access-Control-Allow-Origin 等頭部信息。

iframe 嵌套通訊，postmessage。

本文完?