fetch.js

var http = {
get: function (url) {
return new Promise((resolve, reject) => {
fetch(url)
.then(res => res.json())
.then(data => resolve(data))
.catch(err => reject(err)) })
}, post: function (url, data) {
return new Promise((resolve, reject) => {
fetch(url, {
method: 'POST',
headers: {
'Content-type': 'application/json'
},
body: JSON.stringify(data)
})
.then(res => res.json())
.then(json => resolve(JSON.parse(json.d)))
.catch(err => reject(err))
})
}, put: function (url, data) {
return new Promise((resolve, reject) => {
fetch(url, {
method: 'PUT',
headers: {
'Content-type': 'application/json'
},
body: JSON.stringify(data)
})
.then(res => res.json())
.then(data => resolve(data))
.catch(err => reject(err)) })
}, delete: function (url, data) {
return new Promise((resolve, reject) => {
fetch(url, {
method: 'DELETE',
headers: {
'Content-type': 'application/json'
},
body: JSON.stringify(data)
})
.then(res => res.json())
.then(data => resolve('删除成功'))
.catch(err => reject(err)) })
}
}

调用方式:

var url = 'http://xx.asmx/xx';

var param = {
xx: xx,
xx: xx,
};
http.post(url, param)
.then(data => console.log(data.msgs))
.catch(err => console.log(err))
//.catch(err => console.log(请求失败))

https://blog.csdn.net/qq_40190624/article/details/82873640

https://developer.mozilla.org/zh-CN/docs/Web/API/Fetch_API/Using_Fetch

fetch 封装的更多相关文章

  1. 用ES6和fetch封装网络请求

    导读: fetch: 这个方法是ES2017中新增的特性,这个特性出来后给人一种传统ajax已死的感觉,其实它的作用是替代浏览器原生的XMLHttpRequest异步请求,我们在日常的开发中,基本不会 ...

  2. fetch封装

    import {fetch as fetchPro} from "whatwg-fetch" import qs from "qs" const get=(ur ...

  3. fetch知识点汇总

    使用XHR发送一个json请求一般是这样: const xhr = new XMLHttpRequest() xhr.open('Get', url) xhr.responseType = 'json ...

  4. Jquery ajax, Axios, Fetch区别之我见(转载)

    来源:https://segmentfault.com/a/1190000012836882 引言 前端技术真是一个发展飞快的领域,我三年前入职的时候只有原生XHR和Jquery ajax,我们还曾被 ...

  5. fetch 代替 XMLHttpRequest (json-server 模拟后台接口)

    一.fetch 是 XMLHttpRequest 的替代方案.说白了就是除了 ajax 获取后台数据之外也可以用fetch 来获取. 二.fetch 的支持性还不是很好.挂载于BOM中可以通过浏览器直 ...

  6. 原生 js 封装get ,post, delete 请求

    现在的项目中都在用VUE 以及react 等MVC, MVVM  框架. 丢弃了原始的JQ .不可能为了个$.ajax();而把JQ引进来吧. 在vue1的开发中 提供了 vueResouce, vu ...

  7. fetch 函数分装

    1.fetch /** * 封装 fetch */ import { hashHistory } from 'react-router'; export default function reques ...

  8. React Native 开发豆瓣评分(四)集中管理 fetch 数据请求

    豆瓣评分的API接口 接口是从网上查找的,看样子应该是微信小程序里面扣出来的(ua 里面有 wechatdevtools) 接口都需要设置apiKey(054022eaeae0b00e0fc068c0 ...

  9. vue-d2admin-axios异步请求登录,先对比一下Jquery ajax, Axios, Fetch区别

    先说一下对比吧 Jquery ajax, Axios, Fetch区别之我见 引言 前端技术真是一个发展飞快的领域,我三年前入职的时候只有原生XHR和Jquery ajax,我们还曾被JQuery 1 ...

随机推荐

  1. hadoop的mapReduce和Spark的shuffle过程的详解与对比及优化

    https://blog.csdn.net/u010697988/article/details/70173104 大数据的分布式计算框架目前使用的最多的就是hadoop的mapReduce和Spar ...

  2. gcd(最大公约数)lcm(最小公倍数)E - Wolf and Rabbit

    1.gcd 递归实现 int gcd(int i,int j){ if(j==0) return i; else return gcd(j,i%j);} 2.lcm int gcd(int i,int ...

  3. HTML图片映射

    <img>图片映射 <map>与<area>一起使用来定义一个图像映射(一个可点击的链接区域). <img src="cat.jpg" a ...

  4. 在ubuntu上使用华为的3G无线上网卡 - usb_modeswitch

    众所周知,华为或者中兴的无线上网卡是比较好用的,U盘一样的东西,插进电脑的Usb口就能用,但是,这只是针对windows操作系统而言. 对于linux系统,该设备是无法自动加载驱动的. 因此,需要用到 ...

  5. 紫书 习题 10-14 UVa 10886(暴力+数据范围)

    开始的时候一看这题感觉很难,觉得肯定有什么很快的办法 不能暴力做(受了上一题10-13的影响) 然后一看那个函数感觉无从下手. 然后看了博客发现,原来这道题就是直接暴力-- 因为n的范围为10的7次方 ...

  6. P4555 [国家集训队]最长双回文串(回文树)

    题目描述 顺序和逆序读起来完全一样的串叫做回文串.比如acbca是回文串,而abc不是(abc的顺序为abc,逆序为cba,不相同). 输入长度为 n 的串 S ,求 S 的最长双回文子串 T ,即可 ...

  7. 无比强大!Python抓取cssmoban网站的模版并下载

    Python实现抓取http://www.cssmoban.com/cssthemes网站的模版并下载 实现代码 # -*- coding: utf-8 -*- import urlparse imp ...

  8. 记录遇到的ios下的bugs[废弃]

    请看又一次排版后的文章 新地址

  9. 将IP表存入SQL里的程序

    将IP表存入SQL里的程序 写得比較粗糙,另一点错误,只是能达到效果.请大家測试  create.asp  ---------------------------------------------- ...

  10. 启动springboot

    新建一个springboot项目,idea的做法:一般直接next就行 填写项目使用到的技术,上面的Spring Boot版本建议选择最新的稳定版,主要勾选上Web就可以了,如下图: 新建之后< ...