前端处理后端接口传递过来的图片文件

背景

在之前，从来都是后端返一个图片地址，然后前端直接使用。 那如果后端返了一个图片文件过来，那要怎么做？

---

参考：

vue axios请求图片流文件前端页面显示处理方法

background url base64

js动态创建样式: style 和 link

---

正文

这次我接收到的直接是一个图片文件，然后乱码了。。 如下图

要怎么处理呢？

首先是第一步，请求处理，下面我分别列出了axios、fetch、jq、原生js的处理方式

1.修改请求

1.1. axios

重点在于添加option: responseType: 'arraybuffer'

let url = `imgurl`;
    axios.get(url,{
   responseType: 'arraybuffer'}).then(function(data){
      console.log(data);
    }).catch(