在ReactJS中显示来自flask send_file函数的图像

我使用 Flask send_file 将图像发送到客户端，如下所示：

@app.route('/get-cut-image',methods=["GET"])
def get_cut_img():
   response = make_response(send_file(file_path,mimetype='image/png'))
   response.headers['Content-Transfer-Encoding']='base64'
   return response 

在 React 中我使用 axios 来读取请求

try {
  const dataImage = await axios.get(
    "http://localhost:5000/get-cut-image"
  );
  this.setState({
      images: dataImage.data,
    });
  console.log(dataImage.data);
} catch (error) {
  console.log(error);
}

console.log(dataImage.data) return this:

我需要稍后使用渲染图像<img src={this.state.images}/>但它不显示任何内容。有什么建议吗？

你的 dataImage.data 是二进制大对象，所以你应该尝试：

try {
  const dataImage = await axios.get(
    "http://localhost:5000/get-cut-image"
  );
  
  const blob = await dataImage.data.blob()
  const url = URL.createObjectURL(blob)
  this.setState({
      images: url,
    });
  console.log(url);
} catch (error) {
  console.log(error);
}