平常看貼的零碎點

restFul風格：
非REST的url：http://…../queryItems.action?id=001&type=T01 
REST風格的url：http://…./id/001/type/T01 

ajax的寫法：

var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState === 4 && this.status === 200) {
console.log(this.responseText);
}
};
xhttp.open("GET", "/", true);
xhr.onload = function() {
console.log(xhr.response);
};

xhr.onerror = function() {
console.log("Oops, error");
};
xhttp.send();

fetch：
是瀏覽器提供的原生ajax接口
fetch的用法：

// url (必須), options (可選)
fetch('/some/url', {
method: 'get'
}).then(function(response) {

}).catch(function(err) {
// 出錯了;等價於 then 的第二個參數,但這樣更好用更直觀 :(
});

 

// 鏈式處理,將異步變爲相似單線程的寫法: 高級用法.
fetch('/some/url').then(function(response) {
return //... 執行成功, 第1步...
}).then(function(returnedValue) {
// ... 執行成功, 第2步...
}).catch(function(err) {
// 中途任何地方出錯...在此處理 :(
});

 

//對請求響應頭的操做

// 建立一個空的 Headers 對象,注意是Headers，不是Header
var headers = new Headers();

// 添加(append)請求頭信息
headers.append('Content-Type', 'text/plain');
headers.append('X-My-Custom-Header', 'CustomValue');

// 判斷(has), 獲取(get), 以及修改(set)請求頭的值
headers.has('Content-Type'); // true
headers.get('Content-Type'); // "text/plain"
headers.set('Content-Type', 'application/json');

// 刪除某條請求頭信息(a header)
headers.delete('X-My-Custom-Header');

// 建立對象時設置初始化信息
var headers = new Headers({
'Content-Type': 'text/plain',
'X-My-Custom-Header': 'CustomValue'
});

 

var request = new Request('/some-url', { headers: new Headers({ 'Content-Type': 'text/plain' }) }); fetch(request).then(function() { /* handle response */ });

 

var uploadReq = new Request("/uploadImage", { method: "POST", headers: { "Content-Type": "image/png", }, body: "image data" });

 

fetch(uploadReq ).then(function() { /* handle response */ });