Vuejs-Download File migration from Promise-Request to Axios- First argument must be a string, Buffer, ArrayBuffer, Array, or array-like object

Question

In my vuejs 2 application, I am trying to migrate to axios.

the code worked using Request-Promise, but now I get this error:

First argument must be a string, Buffer, ArrayBuffer, Array, or array-like object

--------> file1.ts
///////////////

import axios from 'axios';

const getAgentFile = async (agentName: string): Promise<any> => {
const url = `${BASE_URL}/${agentName}/export`;
const opt = {
  headers: {
    encoding: null,
    'content-type': 'application/json',
    Authorization: `Bearer ${store.getters.authToken()}`,
  },
};
const agent = await request.get(url, opt);
return agent.data;
};

--------> file2.ts
///////////////

async downloadAgentFile(name: string) {
      const response = await getAgentFile(name);
      const buffer = Buffer.from(response);
      const fileURL = window.URL.createObjectURL(new Blob([buffer]));
      const fileLink = document.createElement('a');
      fileLink.href = fileURL;
      fileLink.setAttribute('download', `${name}.json`);
      document.body.appendChild(fileLink);
      fileLink.click();
    },

Any idea please ?

score 0 · Accepted Answer · answered Aug 17 '21 at 09:26

The solution is to specify responseType: 'arraybuffer'.

import axios from 'axios';

const getAgentFile = async (agentName: string): Promise<any> => {
const url = `${BASE_URL}/${agentName}/export`;
const opt = {
  responseType: 'arraybuffer', // this is the missing part
  headers: {
    encoding: null,
    'content-type': 'application/json',
    Authorization: `Bearer ${store.getters.authToken()}`,
  },
};
const agent = await request.get(url, opt);
return agent.data;
};

I hope It helps others :)

Vuejs-Download File migration from Promise-Request to Axios- First argument must be a string, Buffer, ArrayBuffer, Array, or array-like object

1 Answers1