1. 方式一：后端传送base64编码后的图片

• 后端python代码

# 前端访问接口/image?skuid=999999
@app.route("/image", methods = ["get"])
def sendImage():
    skuid = request.args.get('skuid')
    img_stream = ''
    img_local_path = "./templates/images/" + skuid + "..jpg" # 准备发送给前端图片的路径
    with open(img_local_path, 'rb') as img_f:
        img_stream = img_f.read()
        img_stream = base64.b64encode(img_stream)
    return img_stream

• 前端js代码

//请求图片
  const commodity_image = document.createElement("img");
  let image_request = new XMLHttpRequest();
  let imageURL="/image?skuid=" + r[j]["skuid"];  //r[j]["skuid"]为get请求参数skuid的值
  image_request.open("GET", imageURL);
  image_request.send();
//服务端返回图片的base64编码后将其以图片方式展示到界面上（在返回的编码前面加上"data:image/jpeg;base64,"即可）
  image_request.onload = function () {
              let image_r = image_request.response;
              let imageSRC = "data:image/jpeg;base64," + image_r;
              commodity_image.src = imageSRC
  }
//然后把commodity_image加到网页的 Document 对象中即可

• 前端图片的src

这种方式前端图片的src将会是一大串编码（即data:image/jpeg;base64,加上图片的base64编码）

2. 方式二：后端传送base64编码后的图片（优）

• 后端python代码

from flask import make_response
@app.route("/image", methods = ["get"])
def sendImage():
    skuid = request.args.get('skuid')
    img_local_path = "./templates/images/" + skuid + "..jpg"
    img_f = open(img_local_path, 'rb')
    res = make_response(img_f.read())   # 用flask提供的make_response 方法来自定义自己的response对象
    res.headers['Content-Type'] = 'image/jpg'   # 设置response对象的请求头属性'Content-Type'为图片格式
    img_f.close()
    return res

• 前端js代码

const commodity_image = document.createElement("img");
let imageURL="/image?skuid=" + r[j]["skuid"];
commodity_image.src = imageURL;

• 前端图片的src

image.png