重新封装axios拦截器，使得返回值是res.data.xxx，而不是res.data.data.xxx

最新推荐文章于 2023-11-07 15:03:28 发布
最新推荐文章于 2023-11-07 15:03:28 发布
阅读量357 收藏
点赞数
分类专栏： 2-问题解决 文章标签： 前端 javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_48263336/article/details/129002358
版权 
原来是：
axios.interceptors.response.use((response=> response))  
//返回结果是response.data.data.xxx


封装一下，变成：
axios.interceptors.response.use((response=> response.data)) 
//此时，返回结果是response.data.xxx

 细节问题要做好！

摆渡人_张余歌
关注
专栏目录
Axios响应拦截器 当后台返回的不是常规的状态码,而是自定义字段的解决方案
weixin_52283244的博客
07-24 1378
目标: 简化接口数据的获取操作，优化axios对于接口出错的逻辑处理 问题: 当前后台返回的数据不是以http状态码返回, 而是以一个自定义的字段返回 接口有一个success字段，如果接口失败，后端只是把success字段设置为false，并没有给到我们http错误状态码，http状态码依旧是200，而axios的错误提示需要依赖于非200的状态码，直接导致接口已经失败，但是没有报错提示，所以需要我们手动去触发reject才可以 axios默认会给我们包裹一个data字段，这导致我们.
VUE3（十六）封装axios
web15185420056的博客
03-06 994
一：axios 基础 从浏览器中创建XMLHttpRequest 从node.js发出http请求 支持Promise API 拦截请求和响应 转换请求和响应数据 取消请求 自动转换JSON数据 客户端支持防止CSRF/XSRF 二：axios封装 关于Axios的封装这部分涉及到与后端的一些约定。 什么约定呢？就是在我们请求接口的时候，后端会返回给我们一个code。 在我开发的时候，一般约定 code：-200为登录失效状态 code：-100为接口发生错误状态。（为了避免服务器端接口报错导致前端无法运行
axios的response.data
weixin_44325325的博客
06-30 7268
今天开发时，使用axios返回的response中data有多个数据： 如果是获取cn里的数据的，可以用： response.data.cn 1 但是需求是根据选择来获取数据的，会发生变化，最开始的想法是，用一个变量来记录需要获取的key: 假设need是需要获取的某个key const dkey = this.need; response.data.dkey 1 2 3 这样发现获取不到数据，这是因为vue.js把dkey当成data里的某一个key了，类似于上面的"cn"。 折腾了很久才突然想起，这个d
axios响应拦截器的配置
逆风优雅的博客
02-26 1072
import axios from "axios"; import router from "../router/index"; //引入路由组件,目的是axios响应拦截的时候,用于跳转页面 import ElementUI from "element-ui"; //用于提示用户登录过期 // 中断请求使用axios下面的CancelToken方法 let Cancel = axios.CancelToken; let http = axios.create({ baseURL: "/api", /.
Vue.js使用axios动态获取response里的data数据操作
10-14
主要介绍了Vue.js使用axios动态获取response里的data数据操作，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
axios请求拦截器 和 响应拦截器
m0_64494670的博客
10-06 905
axios请求拦截器 和 响应拦截器
axios请求数据和拦截器
weixin_40442639的博客
09-02 918
一、 Axios Axios是什么 Axios是一个基于 promise 的 HTTP 库 可以用于浏览器和 node.js 类似于 Ajax，进行前后端交互使用 Axios 特性 支持 Promise API 拦截请求和响应 转换请求数据和响应数据 取消请求 自动转换JSON数据 客户端支持防御 XSRF 安装和使用 两种安装方式：（二选一） npm yarn // 使用npm： $ npm install axios // 或者使用yarn： $ yarn add axios 使用方
vue-advanced-chat使用指南（socket.io+node+vue实现聊天）
beekim的博客
11-02 2032
messageSelectionActions: [{ name: 'deleteMessages', title: '你确定要删除嘛？' }]
笔记,前端重点 js,es6,vue2,vue3,小程序...... (记得收藏)
qq_61686552的博客
06-16 861
前端 重点，重点，重点
axios.response返回数据格式
张泽的博客
06-04 2万+
axios.response接口中存储的是如下内容： { //data是服务器的提供的回复（相对于请求） data{}, //`status`是服务器返回的http状态码 status:200, //`statusText`是服务器返回的http状态信息 statusText: 'ok', //`headers`是服务器返回中携带的headers headers:{}, //`config`是对axios进行的设置，目的是为了请求（request） config:{} } 若是从后台接受的是jso
vue响应的res.data和res.data.data
热门推荐
qq_41358574的博客
02-27 2万+
今天因为搜索功能一直接收到了后台数据但是前端页面没有渲染出来很奇怪，详细调试了好久，试验: 后端的数据： @GetMapping("/exam/{examCode}") public ApiResult findById(@PathVariable("examCode") Integer examCode){ System.out.println("根据ID查找"+examCode); ExamManage res = examManageService.findB
Vue中axios数据请求与拦截器封装及请求时跨域问题的解决
Tianxiaoxixi的博客
06-26 1203
Vue中axios数据请求与拦截器封装及请求时跨域问题的解决
axios请求失败，response.data返回的状态码及错误信息获取
草巾冒小子的博客
05-25 9499
axios请求失败，后端接口返回的状态码及错误信息获取
如何配置axios才能让返回值直接能获取到data，而不是response.data.data？
LRQQHM的博客
11-22 1317
axios 拦截器中response配置返回“return res.data;
用axios请求接口数据时，返回两层data数据-该如何优化呢？
JackieDYH的博客
05-29 539
在读取数据的时候还需要加一层data：response.data.data，有没有配置项直接让response返回data，而不用通过response.data去获取。配置axios才能让返回值直接能获取到data，而不是response.data.data。axios 拦截器中response配置返回“return res.data;默认请求接口获取response的返回结果。
Axios的不同responseType的使用场景
最新发布
weixin_40243502的博客
11-07 1555
应用场景：用于将响应数据解析为 JSON 对象，适用于REST API和Web服务的调用。应用场景：用于接收二进制数据，通常是文件下载或处理图片、音频、视频等二进制数据的情况。应用场景：用于将响应数据解析为 HTML 文档对象，适用于获取和操作HTML文档的情况。应用场景：用于处理响应数据流，适用于大文件下载或需要逐行处理数据的情况。应用场景：用于将响应数据解析为纯文本，适用于文本内容的获取。类似，用于接收二进制数据，但通常用于文件下载等场景。一、arraybuffer。三、document。
axios显示html,使用axios 异步显示数据到页面(示例代码)
weixin_39900582的博客
06-21 884
引入所需要的js文件[v-clock]{display: none;}json文件json文件在这个页面里面https://www.cnblogs.com/rzkwz/p/12830917.html编写js//通过new Vue 可以声明全局变量,new返回的对象就是应用对象var vm = new Vue({//el:相当于js的elementel: \'#vue\',data() {retur...
响应拦截器
xihuanLilia的博客
05-18 1165
// 拦截响应回来的数据，通过判断success值到底是true还是false,如果是true,res.data.data -> data 如果false -> 直接到catch // 响应拦截器 request.interceptors.response.use(response => { // axios默认加了一层data const { success, message, data } = response.data // 要根据success的成功与否决定下面的操作 if (
vue axios封装只返回了res.data 如何获取res.header
05-10
如果vue axios封装只返回了res.data，而想要获取res.header，我们需要对封装的axios进行改进。 首先，在axios封装中，需要用到axios实例。在创建axios实例时，会有一些配置，其中，我们需要加入response拦截器。...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值