参考文章:

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每天产生了多大容量的binlog,用SQL语句能查到吗?

    首先,这是个假设性命题(又一个钓鱼题). 这个需求完全可以通过系统层命令,配合MySQL中的"FLUSH BINARY LOGS"快速完成. 运行SHOW MASTER/BINAR ...

  2. 18道kafka高频面试题哪些你还不会?(含答案和思维导图)

    前言 Kafka是最初由Linkedin公司开发,是一个分布式.支持分区的(partition).多副本的(replica),基于zookeeper协调的分布式消息系统,它的最大的特性就是可以实时的处 ...

  3. HDU1395 2^x mod n = 1——积与余数的性质

    对于数论的学习比较的碎片化,所以开了一篇随笔来记录一下学习中遇到的一些坑,主要通过题目来讲解 本题围绕:积与余数 HDU1395 2^x mod n = 1 题目描述 输入一个数n,如果存在2的x次方 ...

  4. Kotlin反射实践操作详解

    继续对反射进行实战. 获取构造方法: 先定义一个主构造方法,2个次构造方法,接下来咱们用反射来获取一下构造方法: 其结果: [fun <init>(kotlin.Int, kotlin.S ...

  5. kafka没配置好,导致服务器重启之后,topic丢失,topic里面的消息也丢失

    转,原文:https://blog.csdn.net/zfszhangyuan/article/details/53389916 ----------------------------------- ...

  6. php+tcpdf如何把生成的pdf文件保存在服务端

    tcpdf组件目前应用得非常广泛,但是对于如何把生成的pdf文件自动保存在服务端却很少有人提及.让我们先来看看标准输出代码:   //服务器存档模式 $pdf->Output('output.p ...

  7. [Javascript] Sort by multi factors

    For example, we have a 2D arrays; const arys = [ [], [], [] ]; We want to sort by the number first, ...

  8. LeetCode 931. Minimum Falling Path Sum

    原题链接在这里:https://leetcode.com/problems/minimum-falling-path-sum/ 题目: Given a square array of integers ...

  9. 将idea中xml文件背景颜色去除(转)

    原贴链接:https://blog.csdn.net/weixin_43215250/article/details/89403678 第一步:除去SQL代码块的背景颜色,步骤如下 设置后还是很影响视 ...

  10. LOJ P10011 愤怒的牛 题解

    每日一题 day36 打卡 Analysis 非常水的二分模板,就直接二分答案,用贪心策略check就好了 #include<iostream> #include<cstdio> ...