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. Mac上vmware虚拟机Windows10安装JDK8及配置环境

    1.jdk8下载地址:http://www.oracle.com/technetwork/java/javase/downloads/index.html 2.双击下载的jdk进行安装 3.安装成功之 ...

  2. CF37E Trial for Chief(最短路)

    题意 题意是给你一张 NMNMNM 的图,每个点有黑色和白色,初始全为白色,每次可以把一个相同颜色的连续区域染色,求最少的染色次数:(n,m<=50) 题解 转化为最短路.对于每一个点与它相邻的 ...

  3. ECNUOJ 2613 Gamma 函数

    Gamma 函数 Time Limit:1000MS Memory Limit:65536KBTotal Submit:237 Accepted:138 Description  Pollux最近在复 ...

  4. cxf 实例解读

    1.sample 实例之一---java_first_pojo 服务端发布服务的方法: 1 HelloWorldImpl helloworldImpl = new HelloWorldImpl(); ...

  5. flash3D学习1

    今天正式学习flash3D. 先配置: watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0 ...

  6. 我看Java二十年:它是怎样永远改变编程的。

    转自jdon的小文章:来自Infoworld的一篇纪念mod=viewthread&tid=3042" target="_blank">Java诞生20周年 ...

  7. 烦人的Facebook分享授权

    开发端授权app权限 facebook要求提交应用到他们平台, 并且还限制100mb, 坑爹死了, 果断使用google drive分享给他们, 最開始不确定分享给他们什么样的程序包, 结果审核没通过 ...

  8. leetcode第一刷_Text Justification

    这个题的接受率好低,搞得我一直不敢做.后来认真的看了一下题目,不是非常难嘛.字符串的题目ac率就是低,除了难,还由于它的測试用例太多. 思路不难,主要是由于特殊情况太多.纯模拟,我把全部的情况罗列一下 ...

  9. spring security源码分析心得

    看了半天的文档及源码,终于理出了spring-security的一些总体思路,spring security主要分认证(authentication)和授权(authority). 1.认证authe ...

  10. 负载均衡-lvs

    常用的负载均衡技术比较DNS 轮询DNS本身的机制不再赘述,这里主要看一看基于DNS的负载均衡,其大致原理很清楚,DNS系统本身支持同一个域名映射到多个ip (A记录),例如 这样每次向DNS系统询问 ...