如何避免axios重复发起无用的请求的最佳实践是？

本文共计1304个文字，预计阅读时间需要6分钟。

前言+在开发中，经常会遇到接口重复请求导致的各种问题。对于重复的get请求，会导致页面更新多次，产生页面卡顿的现象，影响用户体验。对于重复的post请求，会在服务端生成重复的数据，造成资源浪费。

前言

在开发中，经常会遇到接口重复请求导致的各种问题。

对于重复的get请求，会导致页面更新多次，发生页面抖动的现象，影响用户体验。

对于重复的post请求，会导致在服务端生成两次记录（例如生成两条订单记录）。

如果当前页面请求还未响应完成，就切换到了下一个路由，那么这些请求直到响应返回才会中止。

无论从用户体验或者从业务严谨方面来说，取消无用的请求确实是需要避免的。

当然我们可以通过页面loading来避免用户进行下一次的操作，但本文只讨论单纯的如何取消这些无用的请求。

axios 的 cancelToken

axios是一个主流的http请求库，它提供了两种取消请求的方式。