axios error对象解构

前言uniapp的请求都是通过uni.request的api实现的，但是这个api和前端常用的axios库用法上有着太多的不同了，移植起来非常痛苦，所以萌生了自己造一个轮子的想法，由于本人技术菜鸡，只能浅浅的仿照一个了。实际上本人喜欢axios的config的方式调用请求，如下：axios({ method: 'post', url: '/user/12345', data: { firstName: 'Fred', lastName: 'Flintstone' } });所以大体上都是围绕这种用法展开工作的。首先说下使用上...

前端发送token到后端，一般有三种方式：链接中携带token，query参数post这种请求body中携带token头信息携带token但是事实上http已经为我们提供了传token的方式，是一个相对来说比较安全的方式，就是HttpBearerAuth 其实他也是一个头信息来着，只是相对来说多了一点操作，在apipost软件中，我们可以直接可视化设置如果是axios，则是需要添加一个头信息：axios({ method: 'get', url: url, responseType: 'blob', headers: { 'Authoriz...

具体的反代我其实在之前《nuxt 入坑的那些事》就说过了，这里就不多说，主要是讲下我们自己axios怎么处理反代。在nuxt中我们其实可以自己封装一个axios模块来使用，也就是常见的后台管理项目中对aixos模块化的用法。常常就是import引入axios，然后使用拦截器进行加工处理，然后在导出，使用的时候import这个axios。import axios from "axios"; let api = axios.create({ baseURL: xxxxxx, timeout: 15000, }); //请求前 api.interceptors.r...

在axios速读中，我们了解到axios请求的取消方法。const CancelToken = axios.CancelToken; //请求前拦截器 axios.interceptors.request.use(function(config) { //添加取消token const source = CancelToken.source(); config.cancelToken = source.token; //取消请求 source.cancel("取消请求"); return config; }, fu...

快速了解axios常用功能，适用于对axios有一定使用经验的人。常用请求方法的参数axios.get(url, config);get方法支持两个参数，第一个是url，第二个是{}键值对配置对象。axios.post(url, data, config);post方法支持三个参数：请求地址，上传的数据{}，{}键值对配置对象。当然还有一些其他请求类型，可以查看官方文档，这两种常用。除了.xxx方法使用协议，还可以直接传入配置对象的形式使用。axios({ method:'get', url:'xxxx', })这种方式比较适合封装使用。适用度广泛一些。一些常用的config配置...

错误捕获在koa中，我们的错误捕获是通过try...catch实现的，捕获的是next函数，在中间件中next就是下一个中间件触发回调，如果next运行出错了，那么就可以被try...catch捕获。但是，这种捕获，只能捕获同步形式的代码，如果有异步处理，那么try...catch就无法捕获到了。比如：try { setTimeout(() => { throw new Error("出错了") }, 1000) } catch (error) { console.log("error") };按道理，如果能捕获错误，那么...

同事写的，我也是借花献佛，顺带做个笔记axios拦截器添加取消请求的方法因为我们需要在路由进入前判断有没有存在取消请求的方法，所以需要一个存储介质，选用数组，然后存放在vuex中，一是方便动态追踪，二是本来就在axios和router里面import了vuex，就没必要添加window的全局变量了。import axios from "axios"; import store from "./store"; //vuex //拦截器 api.interceptors.request.use(config => { //设置取消请求的...

前端在api请求的时候，有时候可能会遇到发送多个请求的时候，但是实际有效的是最后一次，但是后端响应的值不一定是你最后一次发送的请求，有可能最后一次比之前的还要更快响应，这就导致用户切换到a数据，前端显示是b数据。解决这个情况有很多种方式，比如改动api请求方式，或者请求如果重复同一个接口，取消前面的请求，发起新的请求。这里我们是后者。使用方式官方提供了两个例子，第一个例子照着写怎么都没用，第二个没看懂他的参数到底是data的还是谁的，最终还是百度了好多文章，才渐渐明白。首先，我的项目使用的axios是二次封装的，也就是通过axios.create()方法预设了baseURL和拦截器的，最...

修改协议最近发现axios的修改协议有个很方便的操作，就是通过create创建一个axios对象的时候，就可以直接设置上传协议了。const api = axios.create({ headers: { 'Content-Type': 'application/x-www-form-urlencoded', } }); 这样我们将协议改为了application/x-www-form-urlencoded这个协议可以上传formData对象，但是他不能上传文件，所以如果你要上传文件，需要改为这个协议：multipart/form-data如果默认配置无法满足，你可...

最近遇到如题的一个需求，因为很常用，所以我把它记录下来，方便以后使用。流程用户正常使用时，或者后台刷新了缓存，导致登录超时或者失效，前端api请求得到一个信息，比如code=10010，那么就表示用户登录信息失效了，前端页面就需要提示用户登录失效了，需要重新登录。用户点击确认后，我们删除本地token，然后路由跳转。跳转之前我们需要记录当前的路由，这样用户登录成功后可以跳转回来，体验极好。233...流程示意：登录失效 --> 前端api请求时得到code=10010 --> 弹出提示窗口 --> 用户点击 重新登录 --> 清除token --> ...