How to handle error message and binary response with Axios within a same request Back

When using Axios, we may meet the requirement that we need to handle error response when downloading file within the same request. But how to, as Axios will convert responses according to your specific response type? The answer is specifying response type as ArrayBuffer rather than Blob, and try to parse error responses when the response header Content-Type is application/json, but not application/octet-stream.

Why? When setting with Blob, we cannot synchronously read the content before return responses.

const service = axios.create({
    baseURL: `${location.protocol}//${location.hostname}${window.location.port ? ':' + window.location.port : ''}/xxx/api`,
});

service.interceptors.response.use(
    response => {
        if (!/json$/gi.test(response.headers['content-type'])) {
            /** not json, like binary string */
            return response.data;
        }

        if (response.request.responseType === 'arraybuffer'
            && response.data.toString() === '[object ArrayBuffer]'
        ) {
            /** error response */
            const res = JSON.parse(Buffer.from(response.data).toString('utf8'));
        }

        /** handle res according to the JSON object */
        /** ... */
    },
    error => {/** handle error response status */}
);

When it comes to how to download a file with array buffer, we can learn from the library js-file-download.

const downloader = require('js-file-download');
server.post(url, params, {
    responseType: 'arraybuffer',
}).then(data => {
    downloader(data, 'xxx.csv');    
});

Comments Copyright © aleen42 all right reserved, powered by aleen42

Empty Comments

Sign in GitHub

As the plugin is integrated with a code management system like GitLab or GitHub, you may have to auth with your account before leaving comments around this article.

Notice: This plugin has used Cookie to store your token with an expiration.

authorize