Skip to content

Instantly share code, notes, and snippets.

@jbutko
Last active September 19, 2024 14:28
Show Gist options
  • Save jbutko/d7b992086634a94e84b6a3e526336da3 to your computer and use it in GitHub Desktop.
Save jbutko/d7b992086634a94e84b6a3e526336da3 to your computer and use it in GitHub Desktop.
React, JS, Axios: Download blob file (PDF...)
import axios, { AxiosResponse } from 'axios';
import { get } from 'lodash-es';
const rest = axios.create({
baseURL: 'some base URL goes here',
});
// this one send file as Blob type
const getPdf = () => (
rest.get(`/get-pdf`, {
params: {
cacheBustTimestamp: Date.now(), // prevents IE cache problems on re-download
},
responseType: 'blob',
timeout: 120,
headers: {
Accept: 'application/octet-stream',
},
})
);
export const downloadFile = async (response/*: AxiosResponse*/, filename/*: string*/ = 'download') => {
const data = get(response, 'payload.data', null) || getProp(response, 'data', null);
if (!(data instanceof Blob)) return;
const blob = new Blob([data], { type: 'application/pdf' });
const link = document.createElement('a');
link.href = window.URL.createObjectURL(blob);
link.download = `${filename}-${+new Date()}.pdf`;
link.click();
window.URL.revokeObjectURL(link.href);
};
export const openFileInNewTab = async (response/*: AxiosResponse*/, filename/*: string*/ = 'download') => {
const data = getProp(response, 'payload.data', null) || getProp(response, 'data', null);
if (!(data instanceof Blob)) return;
const blob = new Blob([data], { type: 'application/pdf' });
// IE
if (window.navigator && window.navigator.msSaveOrOpenBlob) {
window.navigator.msSaveOrOpenBlob(data, filename);
return;
}
// Chrome, FF
const fileUrl = URL.createObjectURL(blob);
const w = window.open(fileUrl, '_blank');
w && w.focus();
// if you want to support Safari & Opera iOS version
// if (navigator.userAgent.indexOf('Chrome') != -1 || navigator.userAgent.indexOf('Firefox') != -1) {
// const w = window.open(fileUrl, '_blank');
// w && w.focus();
// } else {
// // Safari & Opera iOS
// window.location.href = fileUrl;
// }
};
@fukemy
Copy link

fukemy commented Jan 31, 2024

where getProp plz, I am using react native

@CesarBustos12
Copy link

nice incorporation

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment