load, save and reload ajax api-responses with vuex

Viewed 793

I have a vue3-app that serves as the frontend of an asp.net core 2 api.

Much of the requested data gets used by multiple components. And in order not to make multiple identical requests, i want to store the response-data in my vuex-store if it's not in there already.

The problem is, that most of that data changes a lot, so i need to be able to tell vuex to refresh the data after some time. But i don't want to refresh all of the requested data, since some of it doesn't need to be refreshed as often and some not at all (for example a list of countries).

So what I need is a way to tell vuex wheter i want to save the response of a specific axios request forever, or to re-request it after a set amount of time.

My questions are: Is there a plugin for this that I couldn't find? And if not, how could i implement the described functionality without rewriting it for every request?

2 Answers

There is a library axios-cache-adapter that is a plugin for axios, to allow caching responses.

It is a great solution for implementing caching layer that takes care of validating cache outside of application's data storage logic and leverages it to requets library instead.

It can be used with both localstorage and indexedDB (via localforage library)

Related