从节点js发送多张图片到前端

const express = require('express');
const fs = require('fs');

const app = express();
const router = express.Router();

router.get('/images', (req, res) => {
  // 读取图片数据
  const image1 = fs.readFileSync('path/to/image1.jpg');
  const image2 = fs.readFileSync('path/to/image2.jpg');
  const image3 = fs.readFileSync('path/to/image3.jpg');

  // 将图片数据转换为Base64编码
  const base64Image1 = image1.toString('base64');
  const base64Image2 = image2.toString('base64');
  const base64Image3 = image3.toString('base64');

  // 发送图片数据给客户端
  res.json({
    image1: base64Image1,
    image2: base64Image2,
    image3: base64Image3,
  });
});

app.use('/', router);

app.listen(3000, () => {
  console.log('Server is running on port 3000');
});

fetch('/images')
  .then(response => response.json())
  .then(data => {
    // 获取图片数据
    const image1Data = data.image1;
    const image2Data = data.image2;
    const image3Data = data.image3;

    // 创建图片元素并显示图片
    const image1Element = document.createElement('img');
    image1Element.src = 'data:image/jpeg;base64,' + image1Data;
    document.body.appendChild(image1Element);

    const image2Element = document.createElement('img');
    image2Element.src = 'data:image/jpeg;base64,' + image2Data;
    document.body.appendChild(image2Element);

    const image3Element = document.createElement('img');
    image3Element.src = 'data:image/jpeg;base64,' + image3Data;
    document.body.appendChild(image3Element);
  })
  .catch(error => {
    console.error('Error:', error);
  });