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的更多相关文章

  1. (转)这个API很“迷人”——新的Fetch API

    原文:https://hacks.mozilla.org/2015/03/this-api-is-so-fetching 原标题是This API is So Fetching,Fetching也可以 ...

  2. Fetch API & Delete & HTTP Methods

    Fetch API & Delete & HTTP Methods vue https://developer.mozilla.org/en-US/docs/Web/API/Fetch ...

  3. 基于Promise规范的fetch API的使用

    基于Promise规范的fetch API的使用 fetch的使用 作用:fetch 这个API,是专门用来发起Ajax请求的: fetch 是由原生 JS 提供的 API ,专门用来取代 XHR 这 ...

  4. Axios & fetch api & Promise & POST

    Axios & fetch api & Promise & POST https://github.com/axios/axios https://appdividend.co ...

  5. fetch API 简单解读

    http://f2e.souche.com/blog/fetch-api-jie-du/?utm_source=tuicool&utm_medium=referral 在我们日常的前端开发中, ...

  6. ES6 Fetch API HTTP请求实用指南

    本次将介绍如何使用Fetch API(ES6 +)对REST API的 HTTP请求,还有一些示例提供给大家便于大家理解. 注意:所有示例均在带有箭头功能的 ES6中给出. 当前的Web /移动应用程 ...

  7. Fetch API与POST请求那些事

    简述 相信不少前端开发童鞋与后端联调接口时,都会碰到前端明明已经传了参数,后端童鞋却说没有收到,尤其是post请求,遇到的非常多.本文以node.js作为服务端语言,借用express框架,简要分析客 ...

  8. js Fetch返回数据res.json()报错问题

    前言 一直以来在简单的场景中经常使用fetch代替第三方请求库, fetch是JavaScript的原生函数, 简单.高效.快速.稳定.可定制等等诸多优点.一直也是用着很是舒服,直到有一天它竟然报错了 ...

  9. 原生JS实战:写了个一边玩游戏,一边记JS的API的游戏

    本文是苏福的原创文章,转载请注明出处:苏福CNblog:http://www.cnblogs.com/susufufu/p/5878913.html 本程序[一边玩游戏,一边记JS的API]是本人的个 ...

随机推荐

  1. yolov3源码darknet在vscode下调试

    1. 安装配置: https://pjreddie.com/darknet/yolo/ darknet文件夹下make命令搞定: 2. 配置vscode 打开安装好的vscode并安装扩展C/C++( ...

  2. escape()、encodeURI()、encodeURIComponent()区别详解 (转)

    JavaScript中有三个可以对字符串编码的函数,分别是: escape,encodeURI,encodeURIComponent,相应3个解码函数:,decodeURI,decodeURIComp ...

  3. linux-提示用户不在 sudoers文件中,此事将被报告。

    在安装oracle创建用户后使用su – oracle命令进入执行相关修改信息(vi file命令)时提示无权限修改 “Can't open file for writing”或“operation ...

  4. Android性能优化-内存优化

    原文链接 Manage Your App’s Memory 前言 在任何软件开发环境中,RAM都是比较珍贵的资源.在移动操作系统上更是这样,因为它们的物理内存通常受限.尽管在ART和Dalvik虚拟机 ...

  5. C#串口SerialPort常用属性方法

    SerialPort(): //属性 .BaudRate;获取或设置波特率 .BytesToRead;得到 接收到数据的字节数 .BytesToWrites;得到送往串口的字节数 .DataBits; ...

  6. 使用Github添加标签

    Github为我们提供了在页面上进行编辑发行版本的方式,如下图所示: 在Github上为项目打tag可在release页面,选择创建新tag并按下图所示填写即可.删除tag也同理.

  7. phpBB3.2 自动检测浏览器语言

    这是根据HTTP request header里的Accept-Language信息来处理的. 首先看一下Accept-Language的格式 Accept-Language: <languag ...

  8. 【LeetCode】242. Valid Anagram (2 solutions)

    Valid Anagram Given two strings s and t, write a function to determine if t is an anagram of s. For ...

  9. List stream 对象 属性去重

    单值去重不写了,记录对象去重 随手一个对象: @Data @AllArgsConstructor public class Milk { private Integer key; private St ...

  10. Adobe Illustrator for Mac(矢量图处理软件)破解版安装

    1.软件简介    Adobe Illustrator CC 是 macOS 系统上一款矢量绘图工具,可以说是是业界标准矢量绘图标杆,软件通过形状.色彩.效果及印刷样式,展现您的创意想法.在处理大型复 ...