前端传来的图片并保存_各种返回图片在前端显示以及转化

前言

作为前端工程师 的我们，日常少不了会跟图片打交道。

以下是我了解的。

一、图片在后端中存储

一般来说，图片在后端的存储方式分为两种：

其一：可以将图片以独立文件的形式存储在服务器的指定文件夹中，再将路径存入数据库字段中;

其二：将图片转换成二进制流，直接存储到数据库的 Image 类型字段中.

对于第一种存储方式，我们前端直接将存储路径赋值给 src 属性即可轻松显示。

对于第二种存储方式，我们前端需要将其二进制流交由 blob 对象处理，然后通过 blob 的 API 生成临时 URL 赋值给 src 属性来显示。

二、在 chrome 的 network 查看的时候，返回的也是这个图片(二进制)

请求图片

可是，在 打印的时候，返回的却是

image.png

出现问题的原因的axios 默认返回的是 json 文本形式，二进制图片数据被强制转换成了 json 文本形式。

找到了原因，解决方案就好办了。我们在 axios 里面，responseType 默认返回数据类型是 json，将其改为返回数据类型 blob。

export function miniprogramQrcode (params) {

return axios.post(

env.MI_URL + '/XXXX/XXX/XXXX',

params,<