How to force axios to not cache in GET requests

Question

I use axios in my React-Native app

first , configure the headers

function configHeaders()
{
    // I tested all these below 3 lines , no on worked
    axios.defaults.headers.common["Pragma"] = "no-cache";
    axios.defaults.headers.common["Cache-Control"] = "no-cache";
    axios.defaults.headers.common["Cache-Control"] = "no-store";
}

the data returned from the below request is old data , not the current data in my database

exports.getInfo = async function ()
{
    configHeaders();
    return await cachios.get(URL + '/user/info').then(data => {
        return { success : true , data : data.data.data.user };
    }).catch(err => {
        return { success : false , message : err.response.data.message };
    });
}

Have you tried 'Cache-Control': 'no-cache' in axios settings? — Vipul Patil, Apr 15 '20 at 08:24
you can also check ans with the link https://stackoverflow.com/questions/49263559/using-javascript-axios-fetch-can-you-disable-browser-cache — Shruti Sharma, Apr 15 '20 at 08:53

score 2 · Accepted Answer · answered Apr 15 '20 at 08:27

You can try to add cache buster in the URL - forcing each request to consider as new:

const cacheBuster = (url) => `${url}?cb=${Date.now()}`;
exports.getInfo = async function ()
{
    configHeaders();
    return await cachios.get(cacheBuster(URL + '/user/info')).then(data => {
        return { success : true , data : data.data.data.user };
    }).catch(err => {
        return { success : false , message : err.response.data.message };
    });
}

How to force axios to not cache in GET requests

1 Answers1