国产 无码 综合区,色欲AV无码国产永久播放,无码天堂亚洲国产AV,国产日韩欧美女同一区二区

Axios使用CancelToken取消重復請求

這篇具有很好參考價值的文章主要介紹了Axios使用CancelToken取消重復請求。希望對大家有所幫助。如果存在錯誤或未考慮完全的地方,請大家不吝賜教,您也可以點擊"舉報違法"按鈕提交疑問。

處理重復請求:沒有響應(yīng)完成的請求,再去請求一個相同的請求,會把之前的請求取消掉
Axios使用CancelToken取消重復請求,Module,javascript,前端,開發(fā)語言
新增一個cancelRequest.js文件

import axios from "axios"
const cancelTokens = {}

export const addPending = (config) => {
    const requestKey = getRequestKey(config)
    if (cancelTokens[requestKey]) {
        cancelTokens[requestKey].cancel('cancel request')
    }
    const source = axios.CancelToken.source()
    cancelTokens[requestKey] = source
    config.cancelToken = source.token
}

export const deletePending = (res) => {
    const requestKey = getRequestKey(res.config)
    if (cancelTokens[requestKey]) {
        delete cancelTokens[requestKey]
    }
}

const getRequestKey = (config = {}) => {
    return config.url + config.method + JSON.stringify(config.params, config.data)
}

request.js文章來源地址http://www.zghlxwxcb.cn/news/detail-655093.html

import axios from "axios"
import { baseUrl } from "@/config"
import { addPending, deletePending } from "./cancelRequest"
const service = axios.create({
    baseURL: baseUrl,
    timeout: 100000,
})
service.interceptors.request.use(
    config => {
        addPending(config)
        return config
    },
    error => {
        return Promise.error(error)
    }
)

service.interceptors.response.use(
    success => {
        deletePending(success)
    },
    error => {
        deletePending(error)
    }
)

export default service

到了這里,關(guān)于Axios使用CancelToken取消重復請求的文章就介紹完了。如果您還想了解更多內(nèi)容,請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!

本文來自互聯(lián)網(wǎng)用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務(wù),不擁有所有權(quán),不承擔相關(guān)法律責任。如若轉(zhuǎn)載,請注明出處: 如若內(nèi)容造成侵權(quán)/違法違規(guī)/事實不符,請點擊違法舉報進行投訴反饋,一經(jīng)查實,立即刪除!

領(lǐng)支付寶紅包贊助服務(wù)器費用

相關(guān)文章

  • axios使用axiosSource.cancel取消請求后怎么恢復請求,axios取消請求和恢復請求實現(xiàn)

    axios使用axiosSource.cancel取消請求后怎么恢復請求,axios取消請求和恢復請求實現(xiàn)

    在前端做大文件分片上傳,或者其它中斷請求時,需要暫停或重新請求,比如這里大文件上傳時,可能會需要暫停、繼續(xù)上傳,如下GIF演示: 這里不詳細說文件上傳的處理和切片細節(jié),后續(xù)有時間在出一篇,大文件上傳,切片上傳、斷點續(xù)傳、秒傳等??。 不扯遠了,緊接本

    2024年02月12日
    瀏覽(23)
  • axios CancelToken 實現(xiàn)對特定請求的攔截,不要所有請求都進行相同的攔截

    一旦給 axios 添加了攔截器,就會對所有的 post、get 等請求進行攔截。但不是所有的請求都需要進行攔截,如公共的請求,即不需要用戶登錄即可發(fā)起請求的 api 我們應(yīng)當放行。 通過 axios.interceptors.request.eject(requestId) 清除 request 或者 response 的攔截器。想要再次恢復就需要重新

    2024年02月05日
    瀏覽(22)
  • axios中取消請求的使用

    1.全局定義一個axios控制器變量 axiosController 2.配置axios 對象signal 3.創(chuàng)建setAxiosController函數(shù) 導出變量、函數(shù) 每次調(diào)用axiosController.abort()方法后就需要重新調(diào)用setAxiosController; axios官網(wǎng) 取消請求 mdn官網(wǎng) AbortController在fetch中的使用

    2024年02月07日
    瀏覽(21)
  • antdesign+vue+ts自定義上傳文件customRequest,顯示進度條onProgress,axios請求中斷axios.CancelToken。

    customRequest里面有一個data參數(shù),data包含了對file文件上傳狀態(tài)的操作:例如:onSuccess、onProgress、onError等 和file文件。 改變文件上傳狀態(tài):可以通過改變fileList里面file的status和respones。 踩坑: 1、在customRequest文件上傳完成以后,會自動重新更新一下fileList文件。上傳之前掛載在

    2023年04月25日
    瀏覽(25)
  • axios如何取消請求,其原理是什么?

    原文合集地址如下,有需要的朋友可以關(guān)注 本文地址 axios 可以通過創(chuàng)建一個 CancelToken 來取消一個請求,基本原理是: 創(chuàng)建一個 CancelToken 的實例,它有一個 executor 函數(shù),可以通過調(diào)用 executor 參數(shù)中的 cancel 函數(shù)來取消請求。 在 axios 請求配置中指定 cancelToken 屬性,將 CancelToken 實例

    2024年02月12日
    瀏覽(20)
  • 封裝axios請求重試和路由切換時請求取消

    封裝axios請求重試和路由切換時請求取消

    請求重試函數(shù):這里注意兩個變量__retryCount 和retry分別代表當前次數(shù)和重試次數(shù)。如果請求中沒有配置retry則正常進行不會進行重試。 請求取消我這里的場景是路由切換時,將上次路由全部取消也可以配置部分取消。注意變量noCancel,他來控制那些不需要被取消。 回顧axios請

    2024年02月21日
    瀏覽(26)
  • 簡單易懂:Axios 如何取消請求的兩種方法

    簡單易懂:Axios 如何取消請求的兩種方法

    在前端開發(fā)中,網(wǎng)絡(luò)請求是非常常見的操作。而有時候,我們可能需要在發(fā)送請求后取消它,比如用戶在請求還未完成時離開了當前頁面或者執(zhí)行了其他操作,本文將介紹如何在使用 Axios 發(fā)送請求時取消這些請求。 在 Axios 中,取消請求的基本思路是創(chuàng)建一個用于取消的標記

    2024年01月19日
    瀏覽(20)
  • vue2/3 axios 請求重試、取消請求、loading 串行并行等(分享)

    基礎(chǔ)版,添加 loading 在請求響應(yīng)攔截器里面添加 loading,這樣就不需要給每一個請求添加 loading 了 這些代碼都是 vue2 項目的,vue3 也通用,改一下 loading 和 message 就好了(主要是 element 的區(qū)別) 我這里最后沒有合并代碼,有的配置不適合寫在一起,看自己項目的需要 響應(yīng)狀態(tài)

    2024年02月10日
    瀏覽(24)
  • 前端網(wǎng)絡(luò)請求之JavaScript XHR、Fetch、Axios

    AJAX:一種在無需重新加載整個網(wǎng)頁的情況下,能夠更新部分網(wǎng)頁的技術(shù)。在后臺與服務(wù)器進行少量數(shù)據(jù)交換,Ajax 可以使網(wǎng)頁實現(xiàn)異步更新。在不重新加載整個網(wǎng)頁的情況下,對網(wǎng)頁的某部分進行更新 Fetch:基于 promise 設(shè)計的。Fetch 的代碼結(jié)構(gòu)比起 ajax 簡單多。fetch 不是 aj

    2024年01月23日
    瀏覽(33)
  • .NET Core使用 CancellationToken 取消API請求

    .NET Core使用 CancellationToken 取消API請求

    您是否曾經(jīng)訪問過一個網(wǎng)站,它需要很長時間加載,最終你敲擊 F5 重新加載頁面。 即使用戶刷新了瀏覽器取消了原始請求,而對于服務(wù)器來說,API也不會知道它正在計算的值將在結(jié)束時被丟棄,刷新五次,服務(wù)器將觸發(fā) 5 個請求。 為了解決這個問題,ASP.NET Core 為 Web 服務(wù)器

    2024年03月17日
    瀏覽(17)

覺得文章有用就打賞一下文章作者

支付寶掃一掃打賞

博客贊助

微信掃一掃打賞

請作者喝杯咖啡吧~博客贊助

支付寶掃一掃領(lǐng)取紅包,優(yōu)惠每天領(lǐng)

二維碼1

領(lǐng)取紅包

二維碼2

領(lǐng)紅包