js fetch api
MDN
fatch
返回的对象
type string
url string
redirected boolean
status number
ok boolean
statusText string
headers object
body object
bodyUsed boolean
clone function
arrayBuffer function
blob function
formData function
json function
text function
get 和 post
get() {
let headers = new Headers();
headers.append('Content-Type', 'application/json');
let option = {
method: 'GET',
headers: headers,
mode: 'cors',
cache: 'default'
};
let request = new Request('/get', option);
fetch(request).then(res => res.json()).then(res => console.log(res));
post() {
let headers = new Headers();
headers.append('Content-Type', 'application/x-www-form-urlencoded;charset=utf-8');
let option = {
method: 'POST',
headers: headers,
mode: 'cors',
cache: 'default'
};
let request = new Request('/post', option);
fetch(request).then(res => res.json()).then(res => console.log(res));
}
rxjs的ajax
rxjs.ajax.ajax.get('/get',{'content-type': 'application/json'})
.pipe(
rxjs.operators.map(res => res.response)
)
.subscribe(
v => { console.log(v) },
e => { console.log(e) },
() => { console.log('complete') }
);
rxjs.ajax.ajax.post('/post',{'content-type': 'application/x-www-form-urlencoded;charset=utf-8'})
.pipe(
rxjs.operators.map(res => res.response)
)
.subscribe(
v => { console.log(v) },
e => { console.log(e) },
() => { console.log('complete') }
);
rxjs 包装 fetch
let get$ = rxjs.from(fetch('/get', {
method: 'GET',
headers: headers
}))
get$.pipe( rxjs.operators.mergeMap(res => rxjs.from(res.json())))
.subscribe(res => console.log( res))
并发请求
let get$ = rxjs.from(fetch('/get', {
method: 'GET',
headers: headers
}))
let get1$ = rxjs.from(fetch('/get1', {
method: 'GET',
headers: headers
}))
let get2$ = rxjs.from(fetch('/get2', {
method: 'GET',
headers: headers
}))
rxjs.merge(get$, get1$, get2$)
.pipe(
rxjs.operators.mergeMap(res => rxjs.from(res.json()))
)
.subscribe(res => console.log(res), err => console.error(err))
js fetch api的更多相关文章
- (转)这个API很“迷人”——新的Fetch API
原文:https://hacks.mozilla.org/2015/03/this-api-is-so-fetching 原标题是This API is So Fetching,Fetching也可以 ...
- Fetch API & Delete & HTTP Methods
Fetch API & Delete & HTTP Methods vue https://developer.mozilla.org/en-US/docs/Web/API/Fetch ...
- 基于Promise规范的fetch API的使用
基于Promise规范的fetch API的使用 fetch的使用 作用:fetch 这个API,是专门用来发起Ajax请求的: fetch 是由原生 JS 提供的 API ,专门用来取代 XHR 这 ...
- Axios & fetch api & Promise & POST
Axios & fetch api & Promise & POST https://github.com/axios/axios https://appdividend.co ...
- fetch API 简单解读
http://f2e.souche.com/blog/fetch-api-jie-du/?utm_source=tuicool&utm_medium=referral 在我们日常的前端开发中, ...
- ES6 Fetch API HTTP请求实用指南
本次将介绍如何使用Fetch API(ES6 +)对REST API的 HTTP请求,还有一些示例提供给大家便于大家理解. 注意:所有示例均在带有箭头功能的 ES6中给出. 当前的Web /移动应用程 ...
- Fetch API与POST请求那些事
简述 相信不少前端开发童鞋与后端联调接口时,都会碰到前端明明已经传了参数,后端童鞋却说没有收到,尤其是post请求,遇到的非常多.本文以node.js作为服务端语言,借用express框架,简要分析客 ...
- js Fetch返回数据res.json()报错问题
前言 一直以来在简单的场景中经常使用fetch代替第三方请求库, fetch是JavaScript的原生函数, 简单.高效.快速.稳定.可定制等等诸多优点.一直也是用着很是舒服,直到有一天它竟然报错了 ...
- 原生JS实战:写了个一边玩游戏,一边记JS的API的游戏
本文是苏福的原创文章,转载请注明出处:苏福CNblog:http://www.cnblogs.com/susufufu/p/5878913.html 本程序[一边玩游戏,一边记JS的API]是本人的个 ...
随机推荐
- centos下mysql自动备份(亲测可用)
编写sh脚本如下: #!/bin/bash db_user="root" db_passwd="123456" db_name="test_db&qu ...
- Centos7:Failed to start LSB: Bring up/down networking
一开始配置的ifcfg-ens33 [root@cdh- ~]# cd /etc/sysconfig/network-scripts/ [root@cdh- network-scripts]# ls ...
- MongoDB 进程控制系列一:查看当前正在执行的进程
1:查看MongoDB当前正在做哪些操作? db.currentOp() 等同于: db.$cmd.sys.inprog.findOne() 2:查看当前有多少个连接? db.serverStatus ...
- 【PMP】合同类型
合同类型与适用场景 图形解读: 总价类 (1)固定总价类合同:货物的采购价格在一开始就已确定,并且不允许改变(除非工作范围发生变更) (2)总价加激励费合同:同会设置价格上限,高于此价格的上限的全部成 ...
- Java Arrays.sort源代码解析
前提: 当用到scala的sortWith,发现: def sortWith(lt: (A, A) ⇒ Boolean): List[A] // A为列表元素类型 根据指定比较函数lt进行排序,且排序 ...
- Atitit 医学之道 attilax总结
Atitit 医学之道 attilax总结 1. 相关的学科3 1.1. 口腔医学 ok3 1.2. 人体解剖学 ok3 1.3. 生理学 ok3 1.4. 病理学 ok3 1.5. 骨伤科学 ...
- What-is-DevOps
https://www.quora.com/What-is-DevOps https://neoteric.eu/blog/devops-a-culture-of-getting-things-don ...
- 【Android】Eclipse快捷键精选
1. ctrl+shift+r:打开资源 这可能是所有快捷键组合中最省时间的了. 这组快捷键可以让你打开你的工作区中任何一个文件,而你只需要按下文件名或mask名中的前几个字母,比如applic*.x ...
- 树莓派2上手 —— Raspbian的一些基本配置问题
先说点废话: 原来的笔记本因为上次被儿子拿着充电器玩的时候漏电烧了主板,修了之后还是时不时就突然宕机,Windows也完全起不来.后面这个问题倒是不大,真要用Windows的时候拿老婆的用一下就是了, ...
- 【iCore4 双核心板_ARM】例程二十:LWIP_TCP_CLIENT实验——以太网数据传输
实验现象: 核心代码: int main(void) { system_clock.initialize(); //ϵͳʱÖÓ³õʼ»¯ led.initialize(); //LED³õʼ ...