前端面试遇到面试官问是否用过vue axios封装怎么破。

面试官：你好，请说说你用过vue axios封装吗？封装过什么？

此时脑袋里可千万别慌，好好回想下项目中的经历。

答题逻辑可以从几个方面去回答

一，什么是axios

Axios 是一个基于 promise 的 HTTP 客户端，用于浏览器和 node.js。它可以从浏览器中创建 XMLHttpRequests，从 node.js 创建 http 请求，并且支持 Promise API。这意味着你可以使用 async/await 关键字来执行异步请求，使得代码更加简洁和易于维护。

二，axios可以封装哪些方面

1. 创建Axios实例

• 基础配置：通过axios.create(config)方法创建一个Axios实例，并传入一些基础配置，如baseURL（请求的基础URL，将自动加在url前面）、timeout（请求超时时间）、headers（默认请求头）等。这些配置将作为该实例发出的所有请求的默认配置。

2. 请求拦截器

• 请求拦截：利用Axios的请求拦截器（interceptors.request.use），在请求发送前对请求进行预处理或修改。例如，可以在这里添加token到请求头中，进行请求的通用配置，或者根据请求URL修改请求参数等。
• 错误处理：在请求拦截器的错误处理函数中，可以对请求过程中发生的错误进行处理，如重定向到登录页面、显示错误提示等。

3. 响应拦截器

• 响应拦截：利用Axios的响应拦截器（interceptors.response.use），在响应返回后对响应进行处理。这包括对响应数据的格式化、统一处理响应状态码（如针对401、403、500等状态码进行特殊处理）、错误处理等。
• 数据格式化：将后端返回的数据结构进行标准化处理，使其更易于前端使用。

4. 封装HTTP方法

• 方法封装：根据业务需求，封装常用的HTTP方法，如get、post、put、delete等。这些封装后的方法可以接受URL、请求参数等作为输入，并返回Promise对象，以便使用async/await进行异步处理。
• 参数配置：在封装HTTP方法时，可以允许调用者传入额外的配置参数，如headers、params等，以覆盖实例的默认配置。

5. 模块化与代码组织

• 模块化：将封装好的Axios实例和HTTP方法组织成模块，便于在项目中重用。例如，可以在项目的src/api目录下创建多个模块文件，每个文件对应一个后端服务或功能模块的API接口。
• 代码清晰：保持代码清晰、易于维护。可以通过合理的命名、注释和文档来提高代码的可读性。

6. 其他配置

• 跨域处理：如果项目涉及跨域请求，可能需要在后端配置CORS（跨源资源共享）策略，并在前端Axios配置中设置withCredentials为true（如果需要携带Cookie等凭证信息）。
• 环境变量：根据项目不同的运行环境（开发、测试、生产），可以使用环境变量来配置Axios实例的baseURL等参数，以提高配置的灵活性和可维护性。

三，项目中实际运用代码