日常看贴的零碎点

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 */ });

posted @ 2018-06-20 20:34  吃草的虾米  阅读(142)  评论(0编辑  收藏  举报