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]是本人的个 ...
随机推荐
- useradd 命令的常见用法
在Linux系统中 useradd 是个很基本的命令,但是使用起来却很不直观.以至于在 Ubuntu 中居然添加了一个 adduser 命令来简化添加用户的操作.本文主要描述笔者在学习使用 usera ...
- 浅谈压缩感知(十九):MP、OMP与施密特正交化
关于MP.OMP的相关算法与收敛证明,可以参考:http://www.cnblogs.com/AndyJee/p/5047174.html,这里仅简单陈述算法流程及二者的不同之处. 主要内容: MP的 ...
- 【Zookeeper】源码分析之Leader选举(二)之FastLeaderElection
一.前言 前面学习了Leader选举的总体框架,接着来学习Zookeeper中默认的选举策略,FastLeaderElection. 二.FastLeaderElection源码分析 2.1 类的继承 ...
- 拯救者y720 双显卡, nvidia 1060 ,Ubuntu16.04 安装 Nvidia 显卡驱动
为了能够记录,下次可以有参考的东西,就记录如此 多谢网上大牛的帖子,我都是安装您们的才顺利的一次性,无黑屏现象的完成了安装 1. 参考: 1.secure boot option ( 开机进入bios ...
- Android——TabHost(标签容器)相关知识总结贴
android 2.3 r1 中文 api (58) —— TabHost http://www.apkbus.com/android-18911-1-1.html android中文api (5 ...
- mysql数据库分区功能及实例详解
分区听起来怎么感觉是硬盘呀,对没错除了硬盘可以分区数据库现在也支持分区了,分区可以解决大数据量的处理问题,下面一起来看一个mysql数据库分区功能及实例详解 一,什么是数据库分区 前段时间写过一篇 ...
- Effective Java 第三版——45. 明智审慎地使用Stream
Tips <Effective Java, Third Edition>一书英文版已经出版,这本书的第二版想必很多人都读过,号称Java四大名著之一,不过第二版2009年出版,到现在已经将 ...
- nginx(一)下载和启动
一.准备工作 http://nginx.org/en/download.html 下载,解压,配置,编译,安装,都用默认的设置即可. 二.安装完成后 默认的安装路径为 /usr/local/nginx ...
- Spring开发工具Spring Tools Suite(STS)
The Spring Tool Suite is an Eclipse-based development environment that is customized for developing ...
- nginx反向代理 强制https请求
upstream emove_pools { server ; check interval= rise= fall= timeout=; } #强制使用https跳转 server { listen ...