main.js 中:

import axios from '................/axios'

axios.js 中:

//axios.js
import Vue from 'vue'
import axios from 'axios'
Vue.prototype.$http = axios //http request 封装请求头拦截器
axios.interceptors.request.use(config => {
// console.log("request")
// console.log(config) //请求方式
let method = config.method.toLowerCase();
if (method === 'get' || method === 'delete') {
Object.assign(config.params, {
"test": "testVAl"
});
}
return config;
}, error => {
return Promise.reject(err);
}); //http response 封装后台返回拦截器
axios.interceptors.response.use(response => {
// console.log(response)
//当返回信息为未登录或者登录失效的时候重定向为登录页面
// if (response.data.code == 'W_100004' || response.data.message == '用户未登录或登录超时,请登录!') {
// router.push({
// path: "/",
// querry: {
// redirect: router.currentRoute.fullPath
// } //从哪个页面跳转
// })
// }
if (typeof response.data === 'string') {
return JSON.parse(response.data);
} else {
return response;
}
}, error => {
return Promise.reject(error)
});

使用:

this.$http.get('/api/......', {params:{}}).then(res => {
console.log(res)
}, res => {
// error callback
});

vue中axios 配置请求拦截功能 及请求方式如何封装的更多相关文章

  1. vue中axios配置代理的俩种方式及优缺点

    概述:Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中 当我们使用vue向服务器发送AJAX请求时,我们会遇到跨域问题,一般跨域的解决方案有俩种,一种是官 ...

  2. vue中axios的安装使用

    axios是一个基于 promise 的 HTTP 库,在vue中axios是比较常用的网络请求方法. 安装 npm install axios -S 在main.js配置 import axios ...

  3. vue中Axios请求豆瓣API数据并展示到Swipe中

    vue中Axios请求豆瓣API数据并展示到Swipe中 1.首先是安装Axios: 安装方法cnpm install axios --save 等待npm安装完毕: 2.在main.js中引入axi ...

  4. vue中axios使用二:axios以post,get,jsonp的方式请求后台数据

    本文为博主原创,转载请注明出处 axios在上一篇中讲过:vue中axios使用一:axios做拦截器,axios是请求后台资源的模块,用来请求后台资源. axios本身是支持get,post请求后台 ...

  5. vue中Axios的封装和API接口的管理

    前端小白的声明: 这篇文章为转载:主要是为了方便自己查阅学习.如果对原博主造成侵犯,我会立即删除. 转载地址:点击查看 如图,面对一团糟代码的你~~~真的想说,What F~U~C~K!!! 回归正题 ...

  6. 聊聊 Vue 中 axios 的封装

    聊聊 Vue 中 axios 的封装 axios 是 Vue 官方推荐的一个 HTTP 库,用 axios 官方简介来介绍它,就是: Axios 是一个基于 promise 的 HTTP 库,可以用在 ...

  7. Vue中axios的封装和api接口的统一管理

    更新的是我csdn上的文章,需要的话可以看下,互相学习点击去我的csdn vue中axios的封装 在vue项目和后端交互获取数据时,通常使用axios库,官方文档:https://www.npmjs ...

  8. vue中axios的深入使用

    如上所示一条简单的请求数据,用到了vue中axios,promise,qs等等 这里我将vue中用到的axios进行了封装方便日后使用  先对工具类进行封装utils/axios.js: // 引入模 ...

  9. vue中怎样实现 路由拦截器

    vue中怎样实现 路由拦截器(当用户没有登录的时候,跳转到登录页面,已经登录的时候,不能跳转到登录页,除非后台token失效) 在 我们需要实现这样 一个功能,登录拦截 其实就是 路由拦截,首先在定义 ...

随机推荐

  1. ALLOT流控设备Qos解读

    ALLOT流控设备Qos解读  1. QOS 服务质量引擎 对于基于用户定义,QoS引擎根据用户定义进行决策,每个帧是否要: 传输数据帧到网络: 将数据帧存储在缓冲区: 丢掉数据帧. 新AOS改进了Q ...

  2. AES解密后多了\0

    AES加密解密之后发现多了几个空格,不知道原因.在调试时发现多了\0这种东西 不知道为什么会多这些.后来.replace("\0","")这样做了事

  3. [Vani有约会]雨天的尾巴(树上差分+线段树合并)

    首先村落里的一共有n座房屋,并形成一个树状结构.然后救济粮分m次发放,每次选择两个房屋(x,y),然后对于x到y的路径上(含x和y)每座房子里发放一袋z类型的救济粮. 然后深绘里想知道,当所有的救济粮 ...

  4. 从Java的角度修复文件下载漏洞

    从Java的角度谈下文件下载漏洞的产生,然后到他的修复方案.这里我的修复方案是白名单,而没有采用黑名单的方式. 首先先看一段存在文件下载漏洞的代码code: HTML视图页面  download.ht ...

  5. mysql 远程连接 10038

    1,先确认本地是否能连上本地能连上就对用户进行授权 mysql>grant all privileges on *.* to 'root'@'%' identified by 'youpassw ...

  6. BZOJ2288 生日礼物

    本题是数据备份的进阶版. 首先去掉所有0,把连续的正数/负数连起来. 计算所有正数段的个数与总和. 然后考虑数据备份,有一点区别: 如果我们在数列中选出一个负数,相当于把它左右连起来. 选出一个正数, ...

  7. 快速傅里叶变换(FFT)

    扯 去北京学习的时候才系统的学习了一下卷积,当时整理了这个笔记的大部分.后来就一直放着忘了写完.直到今天都腊月二十八了,才想起来还有个FFT的笔记没整完呢.整理完这个我就假装今年的任务全都over了吧 ...

  8. 在html页面通过js实现复制粘贴功能

    前言:要实现这个功能,常用的方式大概分为两类,第一种就是上插件,这个网上有大把,第二种就是直接用几行JS来实现. 这次说第二种实现方式,这方式有很大的局限性,只能用表单元素,并且不能设置disable ...

  9. c#两个listbox怎么把内容添加到另外个listbox

    https://bbs.csdn.net/topics/392156324?page=1  public partial class Form1 : Form     {         public ...

  10. interface 界面&接口

    接口:接口(硬件类接口)是指同一计算机不同功能层之间的通信规则称为接口.接口(软件类接口)是指对协定进行定义的引用类型. 界面:窗口,显示 英文解释都是interface partly from ba ...