axios

Mock inner axios.create()

by

OK I got it. Here is how I fixed it! I ended up doing without any mocking libraries for axios! Create a mock for axios in src/__mocks__: // src/__mocks__/axios.ts const mockAxios = jest.genMockFromModule(‘axios’) // this is the key to fix the axios.create() undefined error! mockAxios.create = jest.fn(() => mockAxios) export default mockAxios Then in your … Read more

Automating access token refreshing via interceptors in axios

by

I may have found a way much simpler to handle this : use axios.interceptors.response.eject() to disable the interceptor when I call the /api/refresh_token endpoint, and re-enable it after. The code : /** * Wrap the interceptor in a function, so that i can be re-instantiated */ function createAxiosResponseInterceptor() { const interceptor = axios.interceptors.response.use( (response) => … Read more

Download binary file with Axios

by

I was able to create a workable gist (without using FileSaver) as below: axios.get(“http://my-server:8080/reports/my-sample-report/”, { responseType: ‘arraybuffer’, headers: { ‘Content-Type’: ‘application/json’, ‘Accept’: ‘application/pdf’ } }) .then((response) => { const url = window.URL.createObjectURL(new Blob([response.data])); const link = document.createElement(‘a’); link.href = url; link.setAttribute(‘download’, ‘file.pdf’); //or any other extension document.body.appendChild(link); link.click(); }) .catch((error) => console.log(error));

Force download GET request using axios

by

You’re getting empty PDF ’cause no data is passed to the server. You can try passing data using data object like this axios .post(`order-results/${id}/export-pdf`, { data: { firstName: ‘Fred’ }, responseType: ‘arraybuffer’ }) .then(response => { console.log(response) let blob = new Blob([response.data], { type: ‘application/pdf’ }), url = window.URL.createObjectURL(blob) window.open(url) // Mostly the same, I … Read more

Image returned from REST API always displays broken

by

Avoid sending back base64 encoded images (multiple images + large files + large encoded strings = very slow performance). I’d highly recommend creating a microservice that only handles image uploads and any other image related get/post/put/delete requests. Separate it from your main application. For example: I use multer to create an image buffer Then use … Read more

How to download a file using ReactJS with Axios in the frontend and FastAPI in the backend?

by

In the Axios GET request, you have to make sure the responseType parameter is set to blob. Once you get the response from the API, you will need to pass the Blob object (i.e., response.data) to the URL.createObjectURL() function. Below is a fully working example on how to create and download a file (Document), using … Read more