vue

封装axios

import axios from 'axios'

var instance = axios.create({

    baseURL: 'https://******top:****/api/private/v1/',

    timeout: 3000,

    headers: { Authorization: localStorage.token }

})

/* 请求拦截器 */

axios.interceptors.request.use(

    config => {

        // 每次发送请求之前判断是否存在token

        // 如果存在,则统一在http请求的header都加上token,这样后台根据token判断你的登录情况,此处token一般是用户完成登录后储存到localstorage里的

        localStorage.token && (config.headers.Authorization = localStorage.token)

        return config

    },

    error => {

        return Promise.error(error)

    })

// 响应拦截器

axios.interceptors.response.use(response => {

    return response

}, error => {

    return error

})

export const httpServe = (path, params = {}, method = 'get', data = {}) => {

    return new Promise((resolve, reject) => {

        instance({

            method,

            url: path,

            params,

            data

        })

            .then(res => {

                resolve(res)

            })

            .catch(err => {

                reject(err)

            })

    })

}

封装功能接口

import { httpServe} from '@/http/index.js'

/* 登录 */

export const loginPost=(path,data)=>httpServe(path,{},'post',data)

/* 左侧菜单列表 */

export const menuGet=(path,params)=>httpServe(path,params)

/* 用户列表 */

export const usersGet=(path,params)=>httpServe(path,params)

/* 添加用户 */

export const addusersPost=(path,data)=>httpServe(path,{},'post',data)

后面的页面只需要引入使用就可以了,例如:

import { usersGet } from "@/http/request.js";

usersGet("users", {

        pagesize: this.pagesize,

        pagenum: this.currentPage,

      })

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容