参考文章:

https://www.cnblogs.com/qiuchuanji/p/10048805.html
https://www.cnblogs.com/XHappyness/p/9993878.html

代码示例:

import axios from 'axios'

// 创建一个axios实例
const service = axios.create({
// headers: {
// 'content-type': 'application/json;charset=UTF-8',
// 'token': 'one'
// },
baseURL: 'http://dianphp.fyz.com',
withCredentials: true,
timeout: 5000
}) // 添加请求拦截器
service.interceptors.request.use(config => {
// 在发送请求之前做某事,比如说 设置token
// config.headers['token'] = 'token';
config.headers['X-Token'] = 'xxxxxxxxxxxxxxxxxxx';
return config;
}, error => {
// 请求错误时做些事
return Promise.reject(error);
}); // 添加响应拦截器
service.interceptors.response.use(response => {
const res = response.data;
// 如果返回的状态不是200 就主动报错
if(res.state != 200){
return Promise.reject(res.message || 'error')
}
return response;
}, error => {
return Promise.reject(error.response.data); // 返回接口返回的错误信息
}) export default service

vue---封装request做数据请求的更多相关文章

  1. Vue 封装axios(四种请求)及相关介绍(十三)

    Vue 封装axios(四种请求)及相关介绍 首先axios是基于promise的http库 promise是什么? 1.主要用于异步计算 2.可以将异步操作队列化,按照期望的顺序执行,返回符合预期的 ...

  2. vue使用axios发送数据请求

    本文章是基于vue-cli脚手架下开发 1.安装 npm install axios --s npm install vue-axios --s 2.使用.在index.js中(渲染App组件的那个j ...

  3. vue使用Axios做ajax请求

    vue2.0之后,就不再对vue-resource更新,而是推荐使用axios 1. 安装 axios $ npm install axios 或 $ bower install axios 2. 在 ...

  4. VUE.JS 使用axios数据请求时数据绑定时 报错 TypeError: Cannot set property 'xxxx' of undefined 的解决办法

    正常情况下在data里面都有做了定义 在函数里面进行赋值 这时候你运行时会发现,数据可以请求到,但是会报错 TypeError: Cannot set property 'listgroup' of ...

  5. vue中简单的数据请求 fetch axios

    fetch 不需要额外的安装什么东西,直接就可以使用 fetch(url, { method:'post', headers: { 'Content-Type': 'application/x-www ...

  6. vue---发送数据请求的一些列的问题

    使用vue做数据请求,首先考虑的是封装请求方法request.js import axios from 'axios' import Qs from 'qs' // 创建一个axios实例 const ...

  7. 运行命令区分webpack环境,以及axios数据请求的封装

    在开发环境和线上环境时,由于环境的不同,有时候需要修改一定的代码,可以通过配置webpack环境来减少对代码的修改:另外,有时候去看别人的代码,你可能都找不到他的数据请求在什么位置,最近在做一个vue ...

  8. mpvue学习笔记-之微信小程序数据请求封装

    简介 美团出品的mpvue已经开源出来很久了,一直说要进行一次实践,这不最近一次个人小程序开发就用上了它. 看了微信官方的数据请求模块--request,对比了下get和post请求的代码,发现如果在 ...

  9. $Django 前后端之 跨域问题(同源策略) vue项目(axios跨域请求数据)

    1 跨域问题(多个域之间的数据访问) #同源策略(ip port 协议全部相同) #本站的只能请求本站域名的数据 #CORS实现(跨域资源共享) #实现CORS通信的关键是服务器.只要服务器实现了CO ...

随机推荐

  1. MySQL主从复制什么原因会造成不一致,如何预防及解决?

    一.导致主从不一致的原因主要有: 人为原因导致从库与主库数据不一致(从库写入) 主从复制过程中,主库异常宕机 设置了ignore/do/rewrite等replication等规则 binlog非ro ...

  2. MYSQL使用source命令,导入SQL文件

    命令 source D:/student.sql

  3. Oracle UNDO块

    过程:开始一个事务--通过事务信息找到UNDO块头的所在的段名及数据文件号等--转储UNDO header--在事务表中对应槽位找到前镜像dba--转储数据块--找到对应记录得到bdba--转储数据块 ...

  4. java Excel文件流输出(后台)没有下载提示

    /**方案: *1. *问题源头应该是前端用的是ajax方式请求路径,要想出现下载Excel的弹窗,我个人理解应该是等同于重新打开一个窗口,而ajax默认不动页面直接将值返回,所以没有提升下载. *解 ...

  5. vim 配置遇到的问题

    1 使用 Vundle 安装插件时提示输入 github 账户密码 .vimrc 中 Plugin ‘路径' 的路径填写错误,仔细检查下 2 在 vim 中执行 shell 命令(如 ls)会闪退 . ...

  6. 进程间通信之数据传输--FIFO

    One of the fundamental features that makes Linux and other Unices useful is the “pipe”. Pipes allow ...

  7. PAT甲级1001水题飘过

    #include<iostream> using namespace std; int main(){ int a, b; while(scanf("%d%d", &a ...

  8. Kotlin反射操纵构造方法与伴生对象

    反射操纵伴生对象: 先定义一个伴生对象: 然后咱们通过反射来调用一下它: 比较简单. 反射操纵构造方法: 先来定义一个类: 然后咱们通过反射来调用一个其中的方法,之前当然就得先来调用构造方法,由于我们 ...

  9. es题目

    1.elasticsearch了解多少,说说你们公司es的集群架构,索引数据大小,分片有多少,以及一些调优手段 .2.elasticsearch的倒排索引是什么?3.elasticsearch 索引数 ...

  10. spring配置文件ApplicationContext.xml里面class等没有提示功能

    实现效果: 解决方法: windows–>preference—>myeclipse—>files and editors–>xml—>xmlcatalog 点击add ...