在同一个项目中灵活运用application/json 和application/x-www-form-urlencoded 两种传输格式(配合axios,同时配置loading)
'use strict' import axios from 'axios'
// import qs from 'qs'
import { Notification} from 'element-ui' //使用elementui的提示显示
import { Loading } from 'element-ui'
import router from "../router"; let loading function startLoading() {
loading = Loading.service({
lock: true,
text: '加载中……',
background: 'rgba(0, 0, 0, 0.2)',
})
} function endLoading() {
loading.close()
} let needLoadingRequestCount = 0
export function showFullScreenLoading() {
if (needLoadingRequestCount === 0) {
startLoading()
}
needLoadingRequestCount++
} export function tryHideFullScreenLoading() {
if (needLoadingRequestCount <= 0) return
needLoadingRequestCount--
if (needLoadingRequestCount === 0) {
// setTimeout(()=>{
endLoading()
// },1000)
}
}
axios.interceptors.request.use(config => {
showFullScreenLoading()
return config
}, err => {
return Promise.resolve(err)
}) axios.interceptors.response.use(response => {
tryHideFullScreenLoading()
if (response) {
switch (response.data.code) {
case 4011: //与后台约定登录失效的返回码,根据实际情况处理
sessionStorage.removeItem('');
sessionStorage.removeItem('');
router.replace({
path: '/'
})
}
}
return response
}, err => {
return Promise.resolve(err)
}) let base = '' // 接口地址 export const postRequest = (url, params,Func,isJson) => { //url: 接口名 ,params: 参数 ,Func: 直接取得内容data,isJson:决定取哪种格式
request(url, params,'post',Func,isJson)
}
export const request = (url, params,method,Func,isJson) => {
axios({
method: method,
url: `${base}${url}`,
data: params,
timeout: 6000,
// 格式的转化
transformRequest: [function (data) {
let ret = ''
for (let it in data) {
if(isJson === 1 ){
ret = data[it]
}else{
ret += encodeURIComponent(it) + '=' + encodeURIComponent(data[it]) + '&'
}
}
return ret
}], // 请求头携带信息,类型默认为form,键值模式,传参为1
headers: {
'Content-Type': isJson === 1 ? 'application/json' : 'application/x-www-form-urlencoded',
'authorization': sessionStorage.getItem(''),
'token': sessionStorage.getItem('token')
}
}).then(data=>{
if (data.data.code === 200) {
Func(data.data.data)
}else if(data.data.code === 406){
Notification.info({
title: '错误',
message: data.data.message
})
}else if(data.data.code === 4011){
sessionStorage.removeItem('');
sessionStorage.removeItem('');
// window.location.href = '/'
}else if(data.data.code === 4012){
request('',{
'authorization': sessionStorage.getItem(''),
'refresh_token': sessionStorage.getItem('')
},'post',(res)=>{
//缓存新的token
console.log(res)
let token = res.token;
sessionStorage.setItem("token", token);
request(url, params,method,Func);
}); }else if(data.data.code === 400 || data.data.code === 505 || data.data.code === 404|| data.data.code === 500){
Notification.error({
title: '错误',
message: '网络异常'
})
}else{
Func1(data.data.code,data.data.message);
}
})
}
export const uploadFileRequest = (url, params) => {
return axios({
method: 'post',
url: `${base}${url}`,
data: params,
headers: {
'Content-Type': 'multipart/form-data', //上传文件的传输格式
'authorization': sessionStorage.getItem('userName'),
'token': sessionStorage.getItem('token')
}
})
}
// 方式1,
export const getRequest = (url, params,Func,isJson) => {
request(url, params,'get',Func,isJson)
} // 方式2
export const getRequest = (url,params,Func) => {
return axios({
method: 'get',
url: `${base}${url}`,
headers: {
'Content-Type': 'multipart/form-data',
'authorization':sessionStorage.getItem(''),
'token':sessionStorage.getItem('token')
}
}).then(data=>{
if (data.data.code === 200) {
Func(data.data.data)
}
})
}
在同一个项目中灵活运用application/json 和application/x-www-form-urlencoded 两种传输格式(配合axios,同时配置loading)的更多相关文章
- 【RocketMQ】同一个项目中,同一个topic,可以存在多个消费者么?
一.问题答案 是不可以的 而且后注册的会替换前注册的,MqConsumer2会替换MqConsumer,并且只结束tag-2的消息 /** * @date 2019/05/28 */ @Compone ...
- django同一个项目中连接多个数据库
一.场景与思路 同一个项目中需要连接多个数据库. 二.代码 代码中主要是三个部分,settings.models以及自己写的一个类. 1.自己写的文件:database_app_router.py ...
- application/json和application/x-www-form-urlencoded区别
application/json和application/x-www-form-urlencoded都是表单数据发送时的编码类型. EncType: enctype 属性规定在发送到服务器之前应该如何 ...
- multipart/form-data,application/json和application/x-www-form-urlencoded区别
application/json和application/x-www-form-urlencoded都是表单数据发送时的编码类型. EncType: enctype 属性规定在发送到服务器之前应该如何 ...
- 在Activity中响应ListView内部按钮的点击事件的两种方法!!!
在Activity中响应ListView内部按钮的点击事件的两种方法 转载:http://www.cnblogs.com/ivan-xu/p/4124967.html 最近交流群里面有人问到一个问题: ...
- Django---Http协议简述和原理,HTTP请求码,HTTP请求格式和响应格式(重点),Django的安装与使用,Django项目的创建和运行(cmd和pycharm两种模式),Django的基础文件配置,Web框架的本质,服务器程序和应用程序(wsgiref服务端模块,jinja2模板渲染模块)的使用
Django---Http协议简述和原理,HTTP请求码,HTTP请求格式和响应格式(重点),Django的安装与使用,Django项目的创建和运行(cmd和pycharm两种模式),Django的基 ...
- QT断点续传(原理:需要在HTTP请求的header中添加Rang节,告诉服务器从文件的那个位置开始传输.格式为bytes 开始传输的位置)
//功能: 根据一个URL地址将数据保存到指定路径下,支持断点续传//参数: url --需要访问的URL地址// SavePath -- ...
- (网页)angular中实现li或者某个元素点击变色的两种方法(转)
转自脚本之家: 本篇文章主要介绍了angular中实现li或者某个元素点击变色的两种方法,非常具有实用价值,需要的朋友可以参考下 本文介绍了angular中实现li或者某个元素点击变色的两种方法,分享 ...
- SQL Server中灾难时备份结尾日志(Tail of log)的两种方法
转自:http://www.cnblogs.com/CareySon/archive/2012/02/23/2365006.html SQL Server中灾难时备份结尾日志(Tail of log) ...
随机推荐
- 通过URL传参数,然后第二个页面需要获取参数
/** * 方法说明:通过url参数键值名称获取参数的值 * @method getQueryString * @param name 要获取的参数键值 * @return * @remark */ ...
- Python的基本数据类型,用户交互
整数: int 常见的数字都是int类型. 用于计算或者大小的比较 在32位机器上int的范围是: -2**31-2**31-1,即-2147483648-2147483647 在64位机器上int的 ...
- 修改el-input
无论是input框,还是select, 都是对 el-input 进行修改: .houseRegisterCompany .el-input{ width: 130px; }
- P3391 文艺平衡树(Splay)
题目背景 这是一道经典的Splay模板题--文艺平衡树. 题目描述 您需要写一种数据结构(可参考题目标题),来维护一个有序数列,其中需要提供以下操作:翻转一个区间,例如原有序序列是5 4 3 2 1, ...
- cmd 编码格式
相当于编辑器的声明为gbk格式编码,输出格式也是gbka = '中文' 就会以gbk编码为str,也只能以gbk解码. reload sys修改默认编码 在不指定编码的时候充当默认解码或者编码格式
- 2019-9-2-win10-uwp-颜色转换
title author date CreateTime categories win10 uwp 颜色转换 lindexi 2019-09-02 12:57:38 +0800 2018-2-13 1 ...
- Docker容器网络前提提要
docker exec -it kvstor1 /bin/sh ##[进入一个redis容器] docker exec -it web1 /bin/sh ##[进入一个nginx容器] ###dock ...
- RabbitMQ学习第三记:发布/订阅模式(Publish/Subscribe)
工作队列模式是直接在生产者与消费者里声明好一个队列,这种情况下消息只会对应同类型的消费者. 举个用户注册的列子:用户在注册完后一般都会发送消息通知用户注册成功(失败).如果在一个系统中,用户注册信息有 ...
- mybatis plus generator工具集成(一)
参数配置文档 配置分两步 1.添加依赖 <dependency> <groupId>com.baomidou</groupId> <artifactId> ...
- VC2010 CString.Format使用报错 error C2664
error C2664: “void ATL::CStringT<BaseType,StringTraits>::Format(const wchar_t *,...)”: 不能将参数 1 ...