fetch 函数分装
1.fetch
/**
* 封装 fetch
*/
import { hashHistory } from 'react-router'; export default function request (method, url, body) {
method = method.toUpperCase();
if (method === 'GET') {
// fetch的GET不允许有body,参数只能放在url中
body = undefined;
} else {
body = body && JSON.stringify(body);
} return fetch(url, {
method,
headers: {
'Content-Type': 'application/json',
'Accept': 'application/json',
'Access-Token': sessionStorage.getItem('access_token') || '' // 从sessionStorage中获取access token
},
body
})
.then((res) => {
if (res.status === 401) {
hashHistory.push('/login');
return Promise.reject('Unauthorized.');
} else {
const token = res.headers.get('access-token');
if (token) {
sessionStorage.setItem('access_token', token);
}
return res.json();
}
});
} // GET 请求
export const get = url => request('GET', url);
// POST 请求
export const post = (url, body) => request('POST', url, body);
// PUT 上传
export const put = (url, body) => request('PUT', url, body);
// DELETE 删除
export const del = (url, body) => request('DELETE', url, body);
.
fetch 函数分装的更多相关文章
- TypeScript开发ReactNative之fetch函数的提示问题
使用TypeScript开发ReactNative时,发现在类中调用 fetch 函数时IDE可能会提示找不到,无法加载,特别是当类中存在同名的 fetch 成员方法时更是郁闷了,虽然程序是可以执行的 ...
- reactNative-解决react native使用fetch函数 Network request failed 问题
解决react native使用fetch函数Network request failed问题 最近公司新开发一个app, 用react native架构好后,用xcode模拟器打开app,对接登陆接 ...
- fetch()函数使用的一些技巧
最近项目用到了一些es6的知识,其中大篇幅在vue框架中使用了fetch()函数,总结了一些使用的技巧: 一, 1,POST带参数)fetch提交json格式的数据到服务器: //fetch替换vue ...
- php学习零散笔记—字符串分割、fetch函数和单双引号。
1 字符串分割——split()函数和preg_split()函数 split — 用正则表达式将字符串分割到数组中——貌似PHP5.3以上已不赞成使用 array split ( string $p ...
- ES6 fetch函数与后台交互
最近在学习react-native,遇到调用后端接口的问题.看了看官方文档,推荐使用es6的fetch来与后端进行交互,在网上找了一些资料.在这里整理,方便以后查询. 1.RN官方文档中,可使用XML ...
- Fetch:下一代 Ajax 技术
Ajax,2005年诞生的技术,至今已持续了 10 年.它是一种在客户端创建一个异步请求的技术,本质上它不算创新,是一组技术的组合.它的核心对象是 XMLHttpRequest. 简单回顾下历史 19 ...
- 在 JS 中使用 fetch 更加高效地进行网络请求
在前端快速发展地过程中,为了契合更好的设计模式,产生了 fetch 框架,此文将简要介绍下 fetch 的基本使用. 我的源博客地址:http://blog.parryqiu.com/2016/03/ ...
- (转)这个API很“迷人”——新的Fetch API
原文:https://hacks.mozilla.org/2015/03/this-api-is-so-fetching 原标题是This API is So Fetching,Fetching也可以 ...
- 前端笔记之ES678&Webpack&Babel(下)AMD|CMD规范&模块&webpack&Promise对象&Generator函数
一.AMD和CMD规范(了解) 1.1传统的前端开发多个js文件的关系 yuan.js中定义了一个函数 function mianji(r){ return 3.14 * r * r } main.j ...
随机推荐
- Oracle中创建触发器示例及注意事项
1.oracle 中创建触发器示例 CREATE TABLE "CONCEPT"."FREQUENCYMODIFYLOG" ( "FREQUENCYI ...
- python基础学习笔记——深浅拷贝
2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 lst1 = ["⾦⽑狮王", "紫衫⻰王&qu ...
- MFC中关于子进程创建和关闭操作
创建子进程 PROCESS_INFORMATION ProcessInfo; STARTUPINFO StartupInfo; //This is an [in] parameter ZeroMemo ...
- [转]构建Python+Selenium2自动化测试环境(二)
构建Python+Selenium2自动化测试环境完成之后,就需要测试支持python的selenium的版本是否都支持在不同浏览器上运行,当前我们分别在三个最通用的浏览器上通过脚本来测试. 1.在I ...
- Windows phone UI虚拟化和数据虚拟化(二)
书接上回的Windows phone UI虚拟化和数据虚拟化(一)我们学习了wp的ui虚拟化.今天来和大家分享一下wp的数据虚拟化. 并同时感谢我的同事dgwutao在编写此文时给我的巨大帮助,3ks ...
- Etree方式解析xml知识积累
movies.xml: <collection shelf="New Arrivals"> <movie title="Enemy Behind&quo ...
- 设置Putty 字体 颜色 全屏
效果 1. 字体 2.全屏 3. 颜色 Window->Colours->Default Foreground->Modify设置(我喜欢绿色设置:R:0 G:255 B:0) ...
- [automator学习篇]android 接口-- bluetooth
http://www.android-doc.com/guide/topics/connectivity/bluetooth.html 本地下载的sdk 目录: D:\AndroidSdk\s ...
- 最小的图灵完备语言——BrainFuck
最小的图灵完备语言--BrainFuck 图灵完备性(Turing completness) 在可计算性理论(computability theory)中,图灵等价指的是:对于两个计算机A和B,如果A ...
- HDU 5073 Galaxy ——乱搞
[题目分析] 练习赛的T1. 只要看懂样例就可以猜结论了. 然后大胆猜测剩下的星星是一段,其余的都移到重心上去. 所以只要把计算的式子变形一下就很好维护了. 居然没有1A [代码] #include ...