axios处理后台返回图片流格式数据

问题:调用后台图片接口,后台返回二进制流图片数据格式。前端接收到流后处理数据显示在img标签.

解决:

1、先设置axios接收参数格式为"arraybuffer"。responseType: 'arraybuffer'

2、转换为base64格式图片数据在img标签显示:

return 'data:image/png;base64,' + btoa(

                new Uint8Array(res.data)

                .reduce((data, byte) => data + String.fromCharCode(byte), '')

              );

返回的string直接放在img标签src可直接显示

axios.post(

      this.exportUrl,

      params, {

      responseType: 'blob'

      }

      ).then(function(response) {

      const url = window.URL.createObjectURL(new Blob([response.data]));

      const link = document.createElement('a');

      link.href = url;

      link.target = '_blank';

      link.setAttribute('download', 'Excel名字.xlsx');

      document.body.appendChild(link);

      link.click();

      });

你可能感兴趣的:(axios处理后台返回图片流格式数据)