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. hive parquet table 配置使用压缩

    创建parquet table : create table mytable(a int,b int) STORED AS PARQUET; 创建带压缩的parquet table: create t ...

  2. Perl模块利用CPAN在线安装自动化

    需要解决2个问题: 1.  如何与CPAN交互:利用perl –MCPAN –e ‘install 模块’ 2.  如何安装指定的版本:作者/模块-版本.tar.gz How to install a ...

  3. 通过JMeter来测试Quick Easy FTP Server的上传与下载性能

    FTP性能测试 1.1背景说明 本测试选用的是一个小型的FTP服务器软件:Quick Easy FTP Server.Quick Easy FTP Server是一个全中文的FTP服务器软件,反应迅速 ...

  4. python中一些有用的函数------持续更新中

    strip() 函数 用于移除字符串头尾指定的字符(默认为空格或换行符)或字符序列. str2 = " Runoob " # 去除首尾空格 print (str2.strip()) ...

  5. LiquiBase预判断

    预判断解决的问题:运行liquibase之前,DB中已经存在一个table,所以需要加上预判断: 完整的一个例子: <?xml version="1.0" encoding= ...

  6. [Recompose] Refactor React Render Props to Streaming Props with RxJS and Recompose

    This lesson takes the concept of render props and migrates it over to streaming props by keeping the ...

  7. 99.重载[] * -> ->*

    #include "mainwindow.h" #include <QApplication> #include <QPushButton>> //重 ...

  8. 为什么选择Sqoop1

    1)大部分企业还在使用sqoop1版本 2)sqoop1能满足公司的基本需求 3)sqoop2 功能还不是很成熟和完善 4)sqoop只是一个工具而已,相对比较简单

  9. oracle中查询表的信息,包括表名,字段名,字段类型,主键,外键唯一性约束信息

    来源于网上整理 总结了一下oracle中查询表的信息,包括表名,字段名,字段类型,主键,外键唯一性约束信息,索引信息查询SQL如下,希望对大家有所帮助: 1.查询出所有的用户表select * fro ...

  10. Codefroces A. Saitama Destroys Hotel

    A. Saitama Destroys Hotel time limit per test 1 second memory limit per test 256 megabytes input sta ...