文章目录📋前言🎯为什么要封装axios？🎯如何封装axios？🎯对项目的axios进一步封装📝最后📋前言在之前的文章axios实战进阶练习——基于Vue3+Node.js+ElementPlus实现的联系人列表管理后台中，我们完成了这个基于Vue3+Node.js+ElementPlus实现的联系人列表管理后台的项目，其中项目的后端接口是用Node.js编写的，通过axios来获取接口，所以这篇文章我们来对这个axios进一步的封装。🎯为什么要封装axios？这是前端开发中非常经典一个操作，同时也是一个面试会被问道的技术点，接下来我们从以下几个原因来看看为什么要封装axios。代码复用和可维护

一、axios的封装在vue项目中，和后台交互获取数据这块，我们通常使用的是axios库，它是基于promise的http库，可运行在浏览器端和node.js中。他有很多优秀的特性，例如拦截请求和响应、取消请求、转换json、客户端防御XSRF等。所以我们的尤大大也是果断放弃了对其官方库vue-resource的维护，直接推荐我们使用axios库。如果还对axios不了解的，可以移步axios文档。安装npminstallaxios;//安装axios引入一般我会在项目的src目录中，新建一个request文件夹，然后在里面新建一个http.js和一个api.js文件。http.js文件用来封

微信小程序开发无法加载本地图片先放报错图片最近开始学习编写小程序，跟着教程走到展示图片这一步发现这个错误。按照正常的编程思路和百度大法，大部分说是路径错误和图片不能带有中字。但是按照经验复制相对路径和绝对路径都不行，还是同样的错误。代码如下。imagesrc="/miniprogram/images/1.jpg"mode="heightFix">/image>图片的路径绝对没问题，百度有的博客说用wx:if，我觉得麻烦没用，然后试了试…/返回page的同级目录，根据指示重新指向图片路径，然后就解决了？！可行代码如下。imagesrc="../../images/1.jpg"mode="heig

问题：请求地址变成了localhost:8080+配置的本地地址 原因：baseURL配置的ip不完整axios.defaults.baseURL='192.168.1.107'处理方法：配置完善的ip地址，加上http或httpsaxios.defaults.baseURL='http://192.168.1.107'再次调用后发现已经可以了 

先说结论:axios不能通过get请求发送json数据使用postman可以做到通过get请求发送json数据但是通过 axios框架就不行,主要是因为axios是对ajax的一个封装。他本身不支持get请求在body体传参。原生和jquery的ajax是支持的。建议跟后端沟通，你把json拼在url后面，后端从url的queryString取值。或者使用post请求来传json数据 

Axios拦截器(Interceptors)axios拦截器主要分为两种：请求拦截器和响应拦截器。请求拦截器请求拦截器作用是在发出请求时，拦截下用户的请求，执行完一系列处理再发送出去（像添加cookie、token，请求头等）配置请求拦截器首先创建一个axios实例对象importaxiosfrom'axios'import{ELMessage}from'element-plus'constmyRequest=axios.create({ baseURL:process.env.BASE_API,//这里可以写自己访问的地址,例如127.0.0.1 timeout:3000,//请求超时时间

Axios拦截器(Interceptors)axios拦截器主要分为两种：请求拦截器和响应拦截器。请求拦截器请求拦截器作用是在发出请求时，拦截下用户的请求，执行完一系列处理再发送出去（像添加cookie、token，请求头等）配置请求拦截器首先创建一个axios实例对象importaxiosfrom'axios'import{ELMessage}from'element-plus'constmyRequest=axios.create({ baseURL:process.env.BASE_API,//这里可以写自己访问的地址,例如127.0.0.1 timeout:3000,//请求超时时间

一个登录注册界面，并使用前端数据库实现登陆注册功能 首先是index.html直接在index.html里面写了用axios，实现注册和登录效果图登录/注册若有账号，点击登录登录没有账号，没有注册注册登录注册//获取元素varbtn1=document.getElementById("btn1");varusernameInput=document.getElementById("username");varpasswordInput=document.getElementById("password");//添加点击事件btn1.onclick=function(){//获取用户输入的用户名

我正在为我正在构建的应用程序使用VueJS。我的服务器是用Golang编写的，并且已经设置为接受CORS。在应用程序中，在我的组件之一searchBar中，我已将其设置为在创建数据之前获取一些数据。varsearchBar={prop:[...],data:function(){return{...};},beforeCreate:function(){varsearchBar=this;axios.request({url:'/graphql',method:'post',data:{'query':'{courses{id,name}}'}}).then(function(resp

我正在为我正在构建的应用程序使用VueJS。我的服务器是用Golang编写的，并且已经设置为接受CORS。在应用程序中，在我的组件之一searchBar中，我已将其设置为在创建数据之前获取一些数据。varsearchBar={prop:[...],data:function(){return{...};},beforeCreate:function(){varsearchBar=this;axios.request({url:'/graphql',method:'post',data:{'query':'{courses{id,name}}'}}).then(function(resp