Ajax相關基礎知識總結

時間 2019-11-08

標籤 ajax 相關基礎知識總結欄目 Ajax 简体版

原文原文鏈接

URL:統一資源定位符javascript

網絡的七層協議：網卡驅動網絡層（ip）傳輸層（tcp udp）會話層（）應用層（http、）

restful表徵狀態轉移（一種表徵架構）

CURD 增刪改查

post改 get查 put增 delete刪

head沒有響應主體

get系：get head delete 沒有請求主體

get系和post系區別

get系沒有請求主體

get系會被緩存

get繫有大小限制，最大不能超過8k，可是通常狀況超過4k就用post了（由於get沒有主體，數據都是拼接到url後面，由於瀏覽器對url有大小限制） post都放在了請求主體裏因此沒有大小限制

發送的數據，get系是明文發送，post系會把data放到請求主體裏，沒法看見

GET 仍是 POST？

與 POST 相比，GET 更簡單也更快，而且在大部分狀況下都能用。css

然而，在如下狀況中，請使用 POST 請求：html

沒法使用緩存文件（更新服務器上的文件或數據庫）
向服務器發送大量數據（POST 沒有數據量限制）
發送包含未知字符的用戶輸入時，POST 比 GET 更穩定也更可靠

socket 管即時通信的

經過http創建鏈接 http connection 響應碼 101

經過tcp進行交互

delete put 返回碼是202

http status code 狀態碼

200 成功服務器端和客戶端都成功

202 接受

204 執行成功可是沒有數據

301 永久轉移

302 臨時轉移臨時重定向

負載均衡集羣多臺服務器間的跳轉

303永久重定向、307 臨時重定向

304 走服務器緩存 not modified

響應首部

last-modified 最後一次修改的時間 gmt標準時瀏覽器先找last-modified，不存在就會找etag

atag 文件修改一次時間就變一次經過sha1算法散列值

請求頭部

if-modified-since GMT時間

if-none-match 一串經過檢驗內容進行sha(1|2)算法的字符串

cache-control second 緩存的是秒數

expires gmt data 緩存到何時

400 參數錯誤 bad request

401 未認證 not authoriticated

403 禁止訪問沒有權限 forbidden

404 未找到 not found

417 資源過大

500 服務器內部錯誤 internal server error

502 Bad Gateway是指錯誤網關；無效網關；在互聯網中表示一種網絡錯誤。表如今WEB瀏覽器中給出的頁面反饋。前端

503 併發過高（同時處理的太多）

MIME type 告訴瀏覽器以什麼格式處理數據格式 xxx/xxx

text/html

text/css

text/javaScript

img/png

img/jpg

img/gif

application/json

application/octet-stream

url格式

http 端口80

https 端口443

ftp 文件傳輸協議

smtp 傳輸郵件的

telnet

帳號密碼域名（主機名）端口路徑

scheme://username:password @hostname: port/ path?querystring#hash

http https ftp 協議

文件上傳的mime-type是multi-part/form-data

傳二進制用 application/octet-stream

ArrayBuffer 透明的

Blob 不透明的

1.1和2.0的主要區別？

（1）多路複用

（2）首部壓縮

（3）服務器推送

console.time('a');

for(var i=0;i<1000;i++){};

console.timeEnd('a');

console.tab([{name:'asde',age:12},{name:'asde',age:12},{name:'asde',age:12}])

console.dir();輸出某個對象的詳情

使用jQuery

$.ajax({

url: "test.txt",

type: "get",

dataType: "json",//text

async: true,

success: function (data) {

//data就是咱們請求的結果

console.log(data);

error: function () {

}

});

$.ajax({

url: "test.txt",

type: "post",

data: {

name: "12"

dataType: "json",

success: function (data) {

//data就是咱們請求的結果

console.log(data);

}

});

使用原生的JS

var createXHR = (function () {

if ("XMLHttpRequest" in window) { //XMLHttpRequest 對象用於和服務器交換數據。全部現代瀏覽器均支持 XMLHttpRequest 對象（IE5 和 IE6 使用 ActiveXObject）。

return function () {

return new XMLHttpRequest();

}

if (new ActiveXObject("Microsoft.XMLHTTP")) {

return function () {

return new ActiveXObject("Microsoft.XMLHTTP");

}

if (new ActiveXObject("Msxml2.XMLHTTP")) {

return function () {

return new ActiveXObject("Msxml2.XMLHTTP");

}

if (new ActiveXObject("Msxml3.XMLHTTP")) {

return function () {

return new ActiveXObject("Msxml3.XMLHTTP");

}

})();

var xhr = createXHR();

xhr.open("get", "test.txt");

//如需將請求發送到服務器，咱們使用 XMLHttpRequest 對象的 open() 和 send() 方法：

xmlhttp.open("GET","ajax_info.txt",true);
xmlhttp.send();

方法	描述
open(method,url,async)	規定請求的類型、URL 以及是否異步處理請求。java method：請求的類型；GET 或 POST url：文件在服務器上的位置 async：true（異步）或 false（同步）
send(string)	將請求發送到服務器。web string：僅用於 POST 請求

方法

描述

open(method,url,async)

規定請求的類型、URL 以及是否異步處理請求。java