【axios】axios 添加公共参数

最新推荐文章于 2024-03-31 22:16:05 发布

闲敲棋子落画画

最新推荐文章于 2024-03-31 22:16:05 发布

阅读量1.6k

点赞数

分类专栏： axios 文章标签： javascript

本文链接：https://blog.youkuaiyun.com/jieweiwuwei/article/details/122644508

版权

axios 专栏收录该内容

1 篇文章

订阅专栏

本文详细介绍了如何在axios中设置全局公共参数，包括请求头、查询参数等，以实现统一管理，提高代码复用性和接口调用的标准化。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

'use strict'

import Vue from 'vue'
import axios from 'axios'
import qs from 'qs'     // post form 表单提交，序列化，否则后台接收不到数据

let config = {
  withCredentials: true, // Check cross-site Access-Control
  baseURL: process.env.VUE_APP_URL
}

// 请求超时时间
axios.defaults.timeout = 10000;

const _axios = axios.create(config)

// post 设置请求头
axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=UTF-8';


_axios.interceptors.request.use(
  function (config) {
    // let token
    // // if(process.env.NODE_ENV === 'production') {
    //   token = localStorage.getItem("Authorization") // 生产环境自动调取token
    // // }else {
    //   // token = 'bearer 01823e87-a666-4ff0-a291-d42bf26285cb' //本地开发配置token信息
    // // }
    // if (token) { // 判断是否存在token，如果存在的话，则每个http header都加上token
    //   // 设置请求头
    //   config.headers.common['Authorization'] = token
    //   // config.headers.common['Authorization'] = token/
    // }
    let data = qs.parse(config.data)  // data参数
    const AccessToken = localStorage.getItem('AccessToken')
    const project_id = localStorage.getItem('project_id')
    const project_type_id = localStorage.getItem('project_type_id')
    if (AccessToken) {
      // let commonData = {}
      data['AccessToken'] = AccessToken
                // 每个请求 带上 project_id  project_type_id
      if (project_type_id) {
                    data["active_project_id"] = project_id
      }
      if (project_type_id) {
        data["active_project_type_id"] = project_type_id
      }
        
    }
     // 判断请求的类型
     // 如果是post请求就把默认参数拼到data里面
     // 如果是get请求就拼到params里面
    if (config.method === 'post') {
      config.data = qs.stringify({
        // ...commonData,
        ...data
      })
    }
    // } else if(config.method === 'get') {
    //     config.params = {
    //         token: token,
    //         uid: uid,
    //         ...config.params
    //     }
    // }
    return config
  },
  error => {
    // Do something with request error
    return Promise.reject(error)
  }
)


Plugin.install = function (Vue/* , options */) {
  Vue.axios = _axios
  window.axios = _axios
  Object.defineProperties(Vue.prototype, {
    axios: {
      get () {
        return _axios
      }
    },
    $axios: {
      get () {
        return _axios
      }
    }
  })
}

Vue.use(Plugin)

export default Plugin