Categories: ReactJS

Menggunakan cache axios di react JS

Bismillaahirrohmaanirrohiim…

Ada kalanya kita perlu melakukan cache di react js untuk menghindari pemanggilan API secara berulang-ulang.
Tentu konten yang di cache bukanlah konten yang real time yang datanya terus berubah cepat secara dinamis.

Okay, langsung saja.
Jika menggunakan axios, install dulu axios-cache-adapter dengan cara:

npm install axios-cache-adapter

Ikuti kode di bawah ini dan coba jalankan:

import axios from "axios";
import { setupCache } from 'axios-cache-adapter'


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

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


//Kode axios yang di cache

api.get('http://path/toapi')
    .then(res => {
    //console.log('res: ' + JSON.stringify(res));
})

Semoga tidak ada error.

Bagikan
rasupe

Share
Published by
rasupe
Tags: cache axios

Recent Posts

Template Blogger Blogspot Gratis dan Bagus

Bismillaahirrohmaanirrohiim... Berikut ini beberapa template blogspot yang dapat anda gunakan secara gratis namun tampilannya bagus.…

2 weeks ago

MySQL error di xampp phpmyadmin dengan tabel “inuse”

Bismillaahirrohmaanirrohiim... Bagi yang menggunakan xampp, mungkin sudah familiar dengan database mysql dan web base phpmyadmin.…

2 weeks ago

Solusi CPU usage 100% karena root/.x/static

Bismillaahirrohmaanirrohiim... Bagi pengguna server linux, adakalanya kena serangan hacker, dimana servernya digunakan untuk menjalankan aksi…

1 month ago

Teks panjang jadi titik-titik dengan css

Bismillaahirrohmaanirrohiim... Saat kita membuat kotak dengan lebar dan tinggi tertentu, tentunya teks didalamnya harus kita…

3 months ago

Bekerja dengan clearfix di css untuk posisi gambar dan teks dalam kotak

Bismillaahirrohmaanirrohiim... Clearfix pada css biasanya digunakan untuk menangani posisi elemen saat menggunakan float, dimana float…

3 months ago

Fix npx atau npm tidak jalan di windows

Bismillaahirrohmaanirrohiim... Setelah menginstall node.js dan ingin menggunakan perintah npx atau npm di power shell atau…

3 months ago