前言 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: { ...
具体的反代我其实在之前《nuxt 入坑的那些事》就说过了，这里就不多说，主要是讲下我们自己axios怎么处理反代。 在nuxt中我们其实可以自己封装一个axios模块来使用，也就是常见的后台管理项目中对aixos模块化的用法。 常常就是import引入axios，然后使用拦截器进行加工处理，然后在导出，使用的时候import这个axios。 import axios from "axios"; let api = axios.create({ baseURL: xxxxxx, timeout: 15000, }); //请求前 api.interceptors.request....
在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; }, function(er...
快速了解axios常用功能，适用于对axios有一定使用经验的人。 常用请求方法的参数 axios.get(url, config); get方法支持两个参数，第一个是url，第二个是{}键值对配置对象。 axios.post(url, data, config); post方法支持三个参数：请求地址，上传的数据{}，{}键值对配置对象。 当然还有一些其他请求类型，可以查看官方文档，这两种常用。 除了.xxx方法使用协议，还可以直接传入配置对象的形式使用。 axios({ method:'get', url:'xxxx', }) 这种方式比较适合封装使用。适用度广泛一些。 一些常...
同事写的，我也是借花献佛，顺带做个笔记 axios拦截器添加取消请求的方法 因为我们需要在路由进入前判断有没有存在取消请求的方法，所以需要一个存储介质，选用数组，然后存放在vuex中，一是方便动态追踪，二是本来就在axios和router里面import了vuex，就没必要添加window的全局变量了。 import axios from "axios"; import store from "./store"; //vuex //拦截器 api.interceptors.request.use(config => { //设置取消请求的CancelToken con...
前端在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 -...
没有更多了
最近评论