'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)的更多相关文章

  1. 【RocketMQ】同一个项目中,同一个topic,可以存在多个消费者么?

    一.问题答案 是不可以的 而且后注册的会替换前注册的,MqConsumer2会替换MqConsumer,并且只结束tag-2的消息 /** * @date 2019/05/28 */ @Compone ...

  2. django同一个项目中连接多个数据库

    一.场景与思路 同一个项目中需要连接多个数据库. 二.代码 代码中主要是三个部分,settings.models以及自己写的一个类. 1.自己写的文件:database_app_router.py  ...

  3. application/json和application/x-www-form-urlencoded区别

    application/json和application/x-www-form-urlencoded都是表单数据发送时的编码类型. EncType: enctype 属性规定在发送到服务器之前应该如何 ...

  4. multipart/form-data,application/json和application/x-www-form-urlencoded区别

    application/json和application/x-www-form-urlencoded都是表单数据发送时的编码类型. EncType: enctype 属性规定在发送到服务器之前应该如何 ...

  5. 在Activity中响应ListView内部按钮的点击事件的两种方法!!!

    在Activity中响应ListView内部按钮的点击事件的两种方法 转载:http://www.cnblogs.com/ivan-xu/p/4124967.html 最近交流群里面有人问到一个问题: ...

  6. Django---Http协议简述和原理,HTTP请求码,HTTP请求格式和响应格式(重点),Django的安装与使用,Django项目的创建和运行(cmd和pycharm两种模式),Django的基础文件配置,Web框架的本质,服务器程序和应用程序(wsgiref服务端模块,jinja2模板渲染模块)的使用

    Django---Http协议简述和原理,HTTP请求码,HTTP请求格式和响应格式(重点),Django的安装与使用,Django项目的创建和运行(cmd和pycharm两种模式),Django的基 ...

  7. QT断点续传(原理:需要在HTTP请求的header中添加Rang节,告诉服务器从文件的那个位置开始传输.格式为bytes 开始传输的位置)

    //功能:    根据一个URL地址将数据保存到指定路径下,支持断点续传//参数:    url            --需要访问的URL地址//         SavePath       -- ...

  8. (网页)angular中实现li或者某个元素点击变色的两种方法(转)

    转自脚本之家: 本篇文章主要介绍了angular中实现li或者某个元素点击变色的两种方法,非常具有实用价值,需要的朋友可以参考下 本文介绍了angular中实现li或者某个元素点击变色的两种方法,分享 ...

  9. SQL Server中灾难时备份结尾日志(Tail of log)的两种方法

    转自:http://www.cnblogs.com/CareySon/archive/2012/02/23/2365006.html SQL Server中灾难时备份结尾日志(Tail of log) ...

随机推荐

  1. 爬虫-ajax请求遇到Unicode编码问题

    2018-08--4爬取金色财经网页 网址:https://www.jinse.com/search/EOS 第一步:我观察了网页:发现了网页是一个发送ajax请求的网页,发现如下: 然后 我就先爬取 ...

  2. SQL数据库—<6-001> 常用系统存储过程大全 --摘录网

    -- 来源于网络 -- 更详细的介结参考联机帮助文档 xp_cmdshell --*执行DOS各种命令,结果以文本行返回. xp_fixeddrives --*查询各磁盘/分区可用空间 xp_logi ...

  3. tf.add_to_collection,tf.get_collection简介

    tf.add_to_collection:把变量放入一个集合,把很多变量变成一个列表 tf.get_collection:从一个结合中取出全部变量,是一个列表 tf.add_n:把一个列表的东西都依次 ...

  4. 蛋疼的 403 Forbidden You don’t have permission to access / on this server.

    参考博文: a.http://www.linuxidc.com/Linux/2016-09/134827.htm 这个解释挺好 昨天配置新服务器:以为自己老手  就一步到位结果一直出现 403 For ...

  5. 交叉编译fw_printenv

    source /opt/poky/environment... 创建交叉编译环境. 更改u-boot/tools/env/Make 添加CC 9 CC=aarch64-poky-linux-gcc - ...

  6. 页面加载时loading效果

    页面加载时loading效果: <!DOCTYPE html> <html lang="en"> <head> <meta charset ...

  7. 二、sql新增后返回主键|sql 使用 FOR XML PATH实现字符串拼接|sql如果存在就修改不存在就新增

    一.sql新增后返回主键 1,返回自增的主键: INSERT INTO 表名 (字段名1,字段名2,字段名3,…) VALUES (值1,值2,值3,…) SELECT @@IDENTITY 2,返回 ...

  8. 2019HDU多校第一场 String 贪心

    题意:给你一个字符串,问是否存在一个长度为m的子序列,子序列中对应字符的数目必须在一个范围内,问是否存在这样的字符串?如果存在,输出字典序最小的那个. 思路:贪心,先构造一个序列自动机,序列自动机指向 ...

  9. ida吧

    经过IDA反编译后的代码是:int __cdecl Ompress(void *Dst, int a2, int a3, int a4)//dst( [esp+24h][ebp+4h] );a2([e ...

  10. H2数据库做单测数据库时踩到的坑

    H2数据库用来做单测数据库,可以自定义初始化数据,不用担心数据库内容更改造成单测跑不过问题,不过H2数据库跟实际使用的Mysql还是有一定区别. 1. H2数据库不支持Mysql的批量更新功能,支持批 ...