Преобразовать тип файла в URI данных - React-Dropzone

Question

У меня возникают проблемы интеграции React-dropzone с FeathersJS Upload

Я успешно реализовал RESTful загрузку, когда вы размещаете datauri моей публикации конечной точки. { uri: data:image/gif;base64,........}

Моя проблема заключается в том, чтобы выбрать файл в zone-dropzone и отправить форму, я вижу тип File ... Кажется, мне нужно каким-то образом преобразовать это в URI данных.

Это должно быть обработано Dauria ... Но я думаю, что моя проблема в моем запросе POST, не имея свойства file с правильным файловым форматом. Должен ли я преобразовывать File в FormData?

Answer 1

Вот один из способов сделать это из объекта File:

Использование изображения и FileReader позволяет получить ширину, высоту и base64 данные:

onDrop = (acceptedFiles, rejectedFiles) => { 
 
    const file = acceptedFiles.find(f => f) 
 
    const i = new Image() 
 

 
    i.onload =() => { 
 
    let reader = new FileReader() 
 
    reader.readAsDataURL(file) 
 
    reader.onload =() => { 
 
     console.log({ 
 
     src: file.preview, 
 
     width: i.width, 
 
     height: i.height, 
 
     data: reader.result 
 
     }) 
 
    } 
 
    } 
 
    
 
    i.src = file.preview 
 
}