Как получить несколько изображений из express api в приложение React?

Question

Я использую стек mern для программирования приложения. Я использовал пакет multer с express для загрузки файлов и загружал изображения в каталог в приложении node.js. Теперь я хочу получить изображение из этого каталога. Как я могу это сделать? Я нашел res.sendFile(), но бывают случаи, когда мне нужно получить сразу несколько файлов с сервера. Я также нашел просто путь отправки из api для реагирования и обслуживания из папки в ответ, который я не считаю безопасным? как мне go об этом?

Answer 1

В итоге я использовал потоки для решения своей проблемы, следующий фрагмент может пригодиться кому-то с аналогичной проблемой.

const fs = require('fs')
const stream = require('stream')

app.get('path',(req, res) => {
  const r = fs.createReadStream('path to file') // or any other way to get a readable stream
  const ps = new stream.PassThrough() // <---- this makes a trick with stream error handling
  stream.pipeline(
   r,
   ps, // <---- this makes a trick with stream error handling
   (err) => {
    if (err) {
      console.log(err) // No such file or any other kind of error
      return res.sendStatus(400); 
    }
  })
  ps.pipe(res) // <---- this makes a trick with stream error handling
});

Answer 2

Вы должны отделить серверную часть от передней, что означает, что отделите часть express от части React и сделайте простой API, express также может обслуживать файлы как stati c (поиск в google для stati c обслуживание файлов), затем вызовите API из своего приложения React. Просто укажите URL-адрес изображения приложения React, например example.com/static/image1.png(<img src={"example.com/static/image1.png"} />)