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 ha

    https://blog.csdn.net/daydayup_668819/article/details/70815335 https://www.jianshu.com/p/8a6cc2d7206 ...

  2. 记intel杯比赛中各种bug与debug【其四】:基于长短时记忆神经网络的中文分词的实现

    (标题长一点就能让外行人感觉到高大上) 直接切入主题好了,这个比赛还必须一个神经网络才可以 所以我们结合主题,打算写一个神经网络的中文分词 这里主要写一下数据的收集和处理,网络的设计,代码的编写和模型 ...

  3. 《Python生物信息学数据管理》中文PDF+英文PDF+代码

    生物信息学经典资料,解决生物学问题,通过"编程技法"的形式,涵盖尽可能多的组织.分析.表现结果的策略.在每章结尾都会有为生物研究者设计的编程题目,适合教学和自学.由六部分组成:Py ...

  4. 由防止表单重复提交引发的一系列问题--servletRequest的复制、body值的获取

    @Time:2019年1月4日 16:19:19 @Author:QGuo   背景:最开始打算写个防止表单重复提交的拦截器:网上见到一种不错的方式,比较合适前后端分离,校验在后台实现: 我在此基础上 ...

  5. Win10 + YOLOv3 环境配置,编译,实现目标检测----How to compile YOLOv3 on Windows

    其他比较好的参考链接: 环境配置: 环境配置的最终图片列表:https://blog.csdn.net/shanglianlm/article/details/80322718 视频讲解YOLOv1: ...

  6. Zookeeper入门-Java版本HelloWorld例子

    上一篇介绍了,Zookeeper的基本概念,怎么启动,怎么解决可能遇到的几个问题.本篇,根据网上代码,整理了一个例子,Zookeeper的HelloWorld. 下面这个代码,还是比较简单的,核心类就 ...

  7. 洛谷 P1604 B进制星球

    P1604 B进制星球 题目背景 进制题目,而且还是个计算器~~ 题目描述 话说有一天,小Z乘坐宇宙飞船,飞到一个美丽的星球.因为历史的原因,科技在这个美丽的星球上并不很发达,星球上人们普遍采用B(2 ...

  8. Windows远程登录Linux

    本文以Ubuntu Kylin1404为例,说明如何通过Windows远程登录Linux. 首先,要确保Ubuntu上SSH服务执行正常.默认情况下,Ubuntu已装有SSHclient.比方输入ss ...

  9. 基于Java的开源3D游戏引擎jMonkeyEngine

    jMonkeyEngine简介 jMonkeyEngine是一款纯Java语言编写的游戏引擎,继承了Java应用跨平台的特性,而且是开放源代码的,遵循BSD开源协议,BSD开源协议用一句简单的话概括就 ...

  10. Linux下配置Squid基础教程

    Linux下配置Squid基础教程 本视频高清下载地址:http://down.51cto.com/data/437529 本文出自 "李晨光原创技术博客" 博客,请务必保留此出处 ...