axios封装代理与使用 —（简洁纯净版）

最新推荐文章于 2024-07-03 08:00:00 发布

开心小歆

最新推荐文章于 2024-07-03 08:00:00 发布

阅读量1.8k

点赞数

分类专栏： axios 文章标签： vue.js javascript 前端

本文链接：https://blog.csdn.net/weixin_47928638/article/details/123417460

版权

本文介绍了在Vue项目中如何封装axios，包括安装依赖、创建axios.js和配置跨域代理，以及在vue.config.js和api.js中的设置。同时，详细列举了axios的常用语法和特性，如请求/响应拦截器、请求取消等，适用于前端开发人员进行HTTP请求管理。

摘要由CSDN通过智能技术生成

First 在vue中安装依赖

npm install axios --save          //安装axios

Second 创建一个文件axios.js

import axios from 'axios'
// axios 配置
const service = axios.create({
    baseURL: '/api', // url = base url + request url 配置代理后的请求地址
    // withCredentials: true, // send cookies when cross-domain requests
    // headers:{
    //     'X-Host':'mall.film-ticket.film.list'
    // }  可以在这配置请求头
    timeout: 5000 // request timeout
})


// 添加请求拦截器
service.interceptors.request.use(
    config => {
        // do something before request is sent
        // config.headers['X-Client-Info'] = '{"a":"3000","ch":"1002","v":"5.0.4","e":"1567001471860281