Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Simple plugin which decorates the community axios nuxt-module with an lru-cache
import hash from 'object-hash';
import sizeof from 'object-sizeof';
import lruCache from 'lru-cache';
const cacheEnabled = true;
const cacheMaxAge = 30 * 60 * 1000;
const cacheMaxSize = 128 * 1000 * 1000;
const getCacheKey = config => hash({
method: config.method,
url: config.url,
params: config.params,
data: config.data,
});
export default async ({ app }) => {
const axios = app.$axios;
if (!cacheEnabled) {
return;
}
const cache = lruCache({
maxAge: cacheMaxAge,
max: cacheMaxSize,
length: item => sizeof(item),
});
axios.interceptors.request.use((request) => {
if (request.method === 'get' && cacheEnabled) {
const key = getCacheKey(request);
if (cache.has(key)) {
const data = cache.get(key);
request.data = data;
// Set the request adapter to send the cached response
// and prevent the request from actually running
request.adapter = () => Promise.resolve({
data,
status: request.status,
statusText: request.statusText,
headers: request.headers,
config: request,
request,
});
}
}
return request;
}, error => Promise.reject(error));
axios.interceptors.response.use((response) => {
let bypassCache = false;
try {
// eslint-disable-next-line
bypassCache = JSON.parse(response.config.params.__cache) === false;
} catch (error) {
//
}
if (cacheEnabled && !bypassCache && response.config.method === 'get') {
const key = getCacheKey(response.config);
cache.set(key, response.data);
}
return response;
}, error => Promise.reject(error));
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.