vue中请求接口怎么封装公共地址_vue封装axos请求

对axios进行封装以及将API接口按业务模块统一管理，有助于我们简化代码，方便后期维护

其实vue封装axios是很简单的

首先 在src路径下建http文件夹 并且创建api.js env.js request.js 这三个文件

env.js文件

这个文件主要就是封装我们的公共地址

export default {

// 开发环境

dev: {

baseUrl: "开发环境公共地址"

},

// 测试环境test

test: {

baseUrl: "测试环境公共地址"

},

//线上接口

prod: {

baseUrl: "线上环境公共地址"

}

};

request.js 文件

这里主要就是创建axios 以及封装请求拦截和相应拦截

import axios from "axios";

import env from "./env";

//这里是私有域名 但是也可以不写

var vipUrl = "/app";

// 创建axios实例

const service = axios.create({

//这里拿线上接口测试

baseUrl: env.prod.baseUrl + vipUrl,

headers:{},//请求头

settimeout:2000,//超时时间

});

// 添加请求拦截器</