Невозможно отобразить изображение реакции - PullRequest
0 голосов
/ 15 октября 2018

Я сохранил изображение с помощью почтальона для API, который я создал.Изображение сохраняется следующим образом:

const newProduct = new Product({
    name: req.body.name,
    referenceId: createReferenceId(),
    category: req.body.category,
    image: {
      data: fs.readFileSync(req.body.image),
      contentType: "image/jpg"
    },
    metadata: req.body.metadata
  });
  newProduct
    .save()
    .then(product => res.json(product))
    .catch(err => res.json(err));

Моя схема Мангуста выглядит следующим образом:

const ProductSchema = new Schema({
 name: { type: String, required: true },
  referenceId: { type: String, required: true },
  category: { type: String, required: true },
  image: { contentType: String, data: Buffer },
  metadata: { type: String }
});

Мои сохраненные данные выглядят так:

[255, 216, 255, 224, 0, 16, 74, 70, 73, 70, 0, 1, 2, 1, 0, 100, 0, 100, 0, 0, 255, 225, 13, 5, 69, 120, 105, 102, 0, 0, 77, 77, 0, 42, 0, 0, 0, 8, 0, 7, 1, 18, 0, 3, 0, 0, 0, 1, 0, 1, 0, 0, 1, 26, 0, 5, 0, 0, 0, 1, 0, 0, 0, 98, 1, 27, 0, 5, 0, 0, 0, 1, 0, 0, 0, 106, 1, 40, 0, 3, 0, 0, 0, 1, 0, 2, 0, 0, 1, 49, 0, 2, 0, 0, 0, 20, 0, 0, 0, 11]

IХотите показать это сохраненное изображение в ReactionJS?Я запутался, как я мог это сделать.Пожалуйста, помогите.

1 Ответ

0 голосов
/ 15 октября 2018

Вы можете сохранить свое изображение как dataURL.Ниже приведено обещание, которое я создал для извлечения данных изображения из компонента dropzone.

const promise = new Promise((resolve, reject) => {
  const reader = new FileReader();
  reader.readAsDataURL(filesToUpload[0]);
    reader.onload = () => {
      if (reader.result) {
        resolve(reader.result);
      } else {
        reject(Error('Failed converting to base64'));
      }
    };
});

Затем вы можете получить доступ к данным, используя метод обещания then().

promise.then((result) => {
  // This is the result
  console.log(result);
}, (err) => {
  console.log(err);
});

Как только вы получите dataURL, опубликуйте его в своем API.Затем вы можете легко использовать атрибут src в <img> для отображения изображения.

Надеюсь, это поможет.Ура!

...