https://blog.csdn.net/weixin_46801282/article/details/123386264
解决方案一:
后端把图片转码成base64再发送过来
router.get('/test', (req, res) => {
fs.readFile('./test.png', 'binary', function (err, file) {
if (err) {
console.log(err)
return
} else {
res.send({
status: 0,
message: '调取成功',
data: Buffer.from(file, 'binary').toString('base64'),
})
}
})
})
解决方案二
添加 {responseType: ‘arraybuffer’} 请求头,获取ArrayBuffer类型数据,再转码成base64
axios.get('http://localhost:801/my/test', {
responseType: 'arraybuffer'
}).then(res => {
console.log(res)
// buffer转译
console.log(btoa(new Uint8Array(res.data).reduce((data, byte) => data + String.fromCharCode(byte), '')), 'base64');
})
解决方案三
跟前面方法二一样
添加 {responseType: ‘blob’} 请求头,获取blob类型数据
axios.get('http://localhost:801/my/test', {
responseType: 'blob'
}).then(res => {
console.log(
res
)
const blob = new Blob([res.data])
var reader = new window.FileReader();
reader.readAsDataURL(blob);
reader.onloadend = function () {
document.querySelector('#img').src = reader.result
}
})
标签：返回,responseType,console,res,base64,乱码,blob,data,图片 From： https://www.cnblogs.com/cs122/p/17244826.html