axios的封装理解和基本使用

axios的配置

复制代码
ruoyi的前端对axios进行了封装,让我们发get请求或者是post请求更加方便了。
ruoyi对axios的封装在下面文件中:
复制代码
打开文件,可以看到它有三个显眼的方法,分别是request拦截器、response拦截器和通用下载方法。

ruoYi接口地址配置

js 复制代码
// 创建axios实例
const service = axios.create({
  // axios中请求配置有baseURL选项,表示请求URL公共部分
  baseURL: process.env.VUE_APP_BASE_API,
  // 超时
  timeout: 10000
})

springBoot .yml配置文件解析

js 复制代码
  // 是否需要设置 token
  const isToken = (config.headers || {}).isToken === false
  // 是否需要防止数据重复提交
  const isRepeatSubmit = (config.headers || {}).repeatSubmit === false
  if (getToken() && !isToken) {
    config.headers['Authorization'] = 'Bearer ' + getToken() // 让每个请求携带自定义token 请根据实际情况自行修改
  }
相关推荐
凤城老人5 小时前
从零手写开源私有云盘|Flask+Vue3+Electron全栈网盘,单容器一键部署
python·docker·electron·vue
球球不吃虾7 小时前
Nuxt在使用过程中的一些小总结(二)
前端·vue·nuxt
志尊宝20 小时前
Vue3 零基础每日笔记(038):亲手封装 useDebounceFn 与 useThrottleFn——高频事件的流量阀
前端·javascript·vue·html·vue3
愛芳芳1 天前
基于 Electron + Vue3 的仿 PC 微信客户端项目实战
前端·javascript·css·elementui·typescript·electron·vue
梦想的颜色1 天前
【AI科普】AI 时代,纯 H5+CSS PK React & Vue:前端技术孰优孰劣深入剖析
ai·前端框架·大模型·vue·react·html5·vibecoding
志尊宝1 天前
Vue3 零基础每日笔记(043):defineModel 与 defineExpose 的 TS 用法——3.4+ 新 API 进阶
前端·javascript·vue·html·vue3
avi91111 天前
无厘头 -- 基于vue 公用状态机,已用于放置类篮球卡牌Game
中间件·vue·公用状态·文件间通信
半生过往2 天前
Vue i18n 国际化全套适配实战:一步一步从零到工程化落地
vue·il8n
志尊宝2 天前
Vue3 零基础每日笔记(035):什么是 Composables——mixin 之死与逻辑复用新方案
笔记·vue·html·前端开发·软件开发
志尊宝2 天前
Vue3 零基础每日笔记(030):动态组件与 keep-alive——切换组件与页面缓存
笔记·vue·html·前端开发·软件开发