Ajax常見面試題 -- 前端面試題（二）

時間 2019-12-09

標籤 ajax 常見面試端面試題欄目 Ajax 简体版

原文原文鏈接

1:什麼是ajax？ajax做用是什麼？javascript

異步的javascript和xml AJAX 是一種用於建立快速動態網頁的技術。 ajax用來與後臺交互php

2:原生js ajax請求有幾個步驟？分別是什麼

//建立 XMLHttpRequest 對象
var ajax = new XMLHttpRequest();
//規定請求的類型、URL 以及是否異步處理請求。
ajax.open('GET',url,true);
//發送信息至服務器時內容編碼類型
ajax.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); 
//發送請求
ajax.send(null);  
//接受服務器響應數據
ajax.onreadystatechange = function () {
    if (obj.readyState == 4 && (obj.status == 200 || obj.status == 304)) { 
    }
};

3:json字符串轉換集json對象、json對象轉換json字符串

//字符串轉對象
JSON.parse(json)
eval('(' + jsonstr + ')')   
// 對象轉字符串
JSON.stringify(json)

4:ajax幾種請求方式？他們的優缺點？

經常使用的post,get,delete。不經常使用copy、head、link等等。html

代碼上的區別

1:get經過url傳遞參數 2:post設置請求頭 規定請求數據類型

使用上的區別

1:post比get安全java

(由於post參數在請求體中。get參數在url上面)面試

2:get傳輸速度比post快根據傳參決定的。
(post經過請求體傳參，後臺經過數據流接收。速度稍微慢一些。而get經過url傳參能夠直接獲取)ajax

3:post傳輸文件大理論沒有限制 get傳輸文件小大概7-8k ie4k左右json

4:get獲取數據 post上傳數據
(上傳的數據比較多並且上傳數據都是重要數據。因此不論在安全性仍是數據量級 post是最好的選擇)跨域

5:什麼狀況形成跨域？

同源策略限制不一樣源會形成跨域。如下任意一種狀況不一樣，都是不一樣源。瀏覽器

http://www.baidu.com/8080/index.html安全

6:跨域解決方案有哪些？

1:jsonp 只能解決get跨域(問的最多)

原理：動態建立一個script標籤。利用script標籤的src屬性不受同源策略限制。由於全部的src屬性和href屬性都不受同源策略限制。能夠請求第三方服務器數據內容。
步驟：

去建立一個script標籤
script的src屬性設置接口地址
接口參數,必需要帶一個自定義函數名要否則後臺沒法返回數據。
經過定義函數名去接收後臺返回數據

//去建立一個script標籤
var  script = document.createElement("script");
//script的src屬性設置接口地址 並帶一個callback回調函數名稱
script.src = "http://127.0.0.1:8888/index.php?callback=jsonpCallback";
//插入到頁面
document.head.appendChild(script);
//經過定義函數名去接收後臺返回數據
function jsonpCallback(data){
    //注意  jsonp返回的數據是json對象能夠直接使用
    //ajax  取得數據是json字符串須要轉換成json對象纔可使用。
}

2:CORS：跨域資源共享

原理：服務器設置Access-Control-Allow-OriginHTTP響應頭以後，瀏覽器將會容許跨域請求
限制：瀏覽器須要支持HTML5，能夠支持POST，PUT等方法兼容ie9以上

須要後臺設置

Access-Control-Allow-Origin: * //容許全部域名訪問，或者

Access-Control-Allow-Origin: http://a.com //只容許全部域名訪問

3:設置 document.domain

原理：相同主域名不一樣子域名下的頁面，能夠設置document.domain讓它們同域
限制：同域document提供的是頁面間的互操做，須要載入iframe頁面

var ifr = document.createElement('iframe');
ifr.src = 'http://b.a.com/bar'; 
ifr.onload = function(){
    var ifrdoc = ifr.contentDocument || ifr.contentWindow.document;
    ifrdoc.getElementsById("foo").innerHTML);
};

ifr.style.display = 'none';
document.body.appendChild(ifr);

4:用Apache作轉發（逆向代理），讓跨域變成同域

7:http常見狀態碼有哪些？

一: 2開頭狀態碼