axios-cache-interceptor

What is axios-cache-interceptor?

The axios-cache-interceptor package is a middleware for Axios that provides caching capabilities. It allows you to cache HTTP requests and responses, reducing the number of network requests and improving performance.

What are axios-cache-interceptor's main functionalities?

Basic Caching

This feature allows you to set up basic caching for your Axios requests. The example demonstrates how to create a cache with a maximum age of 15 minutes and use it with an Axios instance.

const axios = require('axios');
const { setupCache } = require('axios-cache-interceptor');

const cache = setupCache({
  maxAge: 15 * 60 * 1000 // 15 minutes
});

const api = axios.create({
  adapter: cache.adapter
});

api.get('https://api.example.com/data')
  .then(response => console.log(response.data))
  .catch(error => console.error(error));

Custom Cache Key

This feature allows you to define a custom cache key. The example shows how to create a cache key based on the request URL, method, and parameters.

const axios = require('axios');
const { setupCache } = require('axios-cache-interceptor');

const cache = setupCache({
  key: req => req.url + req.method + JSON.stringify(req.params)
});

const api = axios.create({
  adapter: cache.adapter
});

api.get('https://api.example.com/data', { params: { id: 1 } })
  .then(response => console.log(response.data))
  .catch(error => console.error(error));

Cache Invalidation

This feature allows you to manually invalidate the cache for specific requests. The example demonstrates how to invalidate the cache for a specific URL.

const axios = require('axios');
const { setupCache } = require('axios-cache-interceptor');

const cache = setupCache();

const api = axios.create({
  adapter: cache.adapter
});

api.get('https://api.example.com/data')
  .then(response => console.log(response.data))
  .catch(error => console.error(error));

// Invalidate the cache for a specific request
cache.invalidate({ url: 'https://api.example.com/data' });

Other packages similar to axios-cache-interceptor

axios-cache-adapter

axios-cache-adapter is another caching library for Axios. It provides similar functionality to axios-cache-interceptor, allowing you to cache HTTP requests and responses. However, axios-cache-adapter offers more configuration options for cache storage, such as using localStorage or a custom store.

axios-extensions

axios-extensions is a package that extends Axios with additional features, including caching. It provides a simple way to add caching to your Axios requests and supports various cache strategies. Compared to axios-cache-interceptor, axios-extensions offers more flexibility in defining cache strategies and expiration times.

README

  

  
🗄️📦💿
Axios Cache Interceptor
  

  

This library is in beta and can have breaking changes until v1.
Not ready for production usage!

axios-cache-interceptor is a axios wrapper for caching and preventing unneeded requests

import axios from 'axios';
import { createCache, SessionCacheStorage } from 'axios-cache-interceptor';

// Any custom axios instance
const api = axios.create();

// Other axios instance with caching enabled
const cachedApi = createCache(api, {
  // Store values on window.sessionStorage
  storage: new SessionCacheStorage(),

  // Use the max-age header to determine the cache expiration time
  interpretHeader: true
});

// Make a simple request, with caching support, to the api
const { data } = await cachedApi.get('https://api.example.com/');

Installing

Axios is a peer dependency and must be installed separately.

# Npm
npm install --save axios axios-cache-interceptor

# Yarn
yarn add axios axios-cache-interceptor

Inspiration

This project is highly inspired by several projects, written entirely in typescript, supporting https headers and much more.

Take a look at some similar projects:

• axios-cache-adapter
• axios-cache-plugin
• @tusbar/cache-control

License

Licensed under the MIT. See LICENSE for more informations.

Contact

See my contact information on my github profile or open a new issue.

Changelog

v0.2.0 - 2021-09-20

Merged

• chore(deps-dev): bump @types/node from 16.9.2 to 16.9.4 #14
• chore(deps-dev): bump @types/node from 16.9.1 to 16.9.2 #13
• chore(deps-dev): bump prettier from 2.4.0 to 2.4.1 #12

Commits

• chore: changelog generation 4363f65
• feat: enable cache by creating or applying f4bbd8b
• fix: a bunch of tests 6075a0a
• fix: axios headers are lowercased 1f88779
• fix: concurrent requests not beeing cached 1490bfc
• refactor: interceptors in classes f1033a5
• refactor: renamed status constants 6e61c0d
• refactor: requests ids can also be symbol 38133a7
• style: prettified code 45630e3
• tag: v0.2.0 8228045
• tag: v0.2.0 3ae95cf