Greetings, I am currently fetching a file using axios in the following manner:
return axios({
method: "get",
url: URL,
responseType: "blob",
})
.then((response) => {
return {
...val,
blob: response.data,
};
})
.catch((_) => {
onError(val);
});
Once I have the file, I proceed to store it in indexDB using Dexie.
const { id } = dataToSave;
return db.files.put(dataToSave, id);
In the database, the file is stored as a blob. https://i.sstatic.net/vACqq.png
My intention now is to save it using the following method: download(myBlob, title, mimeType); I have tried using filesaver, downloadjs, and manual methods.
const { title, blob, mimeType } = material;
const url = window.URL.createObjectURL(blob);
const a = document.createElement("a");
a.style.display = "none";
a.href = url;
// specify the filename
a.download = title;
document.body.appendChild(a);
a.click();
setTimeout(() => {
window.URL.revokeObjectURL(url);
document.body.removeChild(a);
}, 1000);
The file downloads successfully only during the current browser session. Upon refreshing the page, I encounter the error code WebkitBlobResource:1
.
Are there any workarounds to this issue? I am seeking a solution to either download the file (pdf, html) or open it in a new or the same tab.