I try to get a fresh list of data by invoking a url using fetch. This url return a json. Following the instructions described in these links fetch(), how do you make a non-cached request? and https://hacks.mozilla.org/2016/03/referrer-and-cache-control-apis-for-fetch/, I build the following init object.
const headers = new Headers();
headers.append('pragma', 'no-cache');
headers.append('cache-control', 'no-cache');
const init = {
method: 'GET',
headers: headers,
cache: 'reload',
};
But after adding it as a second argument to fetch method the return data does not include the most recently added data, so I think it is due to cache.
The complete example is as follows
function getYears() {
const id = getId();
const request = new Request(`index.php?ep=name&id=${id}`);
const headers = new Headers();
headers.append('pragma', 'no-cache');
headers.append('cache-control', 'no-cache');
const init = {
method: 'GET',
headers: headers,
cache: 'reload',
};
fetch(request, init)
.then(response => response.json())
.then(json => {
window.yearCollection = years;
})
.catch(error => {
console.log(error.message);
});
}
The logical flow is the following, when loading the page the method getYears () is invoked, then when sending data in a form, the page is reloaded. Here the list of years is not updated, I must refresh the page manually, to get the list with the updated data