Konvertieren Sie die Bild-URL in eine Dateiinstanz

Question

Ich habe ein Array von Bilddaten und versuche, es in eine Dateiarray

umzuwandeln.

const images = [
  { img: "http://localhost/images/1.jpg", Name: "1.png", mime_type: "image/jpeg"
  { img: "http://localhost/images/2.jpg", Name: "2.png", mime_type: "image/jpeg"
]
const res: File[] = images.map(function (item) {
  gib eine neue Datei zurück([item.img], item.name, { type: item.mime_type })
})

Das funktioniert nicht :(So wie ich es verstehe, sollte das konvertierte Bild in base24 an den Dateikonstruktor übergeben werden? Wie mache ich das?

Update: Ich habe eine VUE-Komponente, die Bilder verarbeitet. Die Eingabekomponente verfügt über eine Eigenschaft vom Typ Array. So erstellen Sie ein Array basierend auf den von der Datenbank zurückgegebenen Daten. Gibt aus der Datenbank zurück: Bildlink, Name und Typ.

UPD2-Antwort:

let PhotosAsFile: File[] = []
const _photos = [
  { url: "http://localhost:8080/images/1.jpeg", Name: "name1", mime_type: "image/jpeg"
  { url: "http://localhost:8080/images/2.jpeg", Name: "name2", mime_type: "image/jpeg"
  { url: "http://localhost:8080/images/3.jpeg", Name: "name3", mime_type: "image/jpeg"
]

const data: Promise<File>[] = _photos.map(async function (item): Promise<File> {
  const myBlob: Blob = waiting getBlobFromUrl(item.url)
  const extensionsFile: RegExpMatchArray |. null |. undefiniert = item.url?.match(/.([^.]+)$/)

  return new File([myBlob], extensionsFile && item.name ? item.name + "." + extensionsFile[1] : "image.jpeg", {
    Typ: item.mime_type ?? "image/jpeg",
  })
})

Promise.all(data).then((values: File[]): void => {
  PhotosAsFile = Werte
})

const getBlobFromUrl = (url): Promise<Blob>
  neues Versprechen zurückgeben((auflösen, ablehnen): void => {
    const-Anfrage: XMLHttpRequest = new XMLHttpRequest()
    request.open("GET", URL, true)
    request.responseType = "blob"
    request.onload = () =>
      lösen(request.response)
    }
    request.onerror = ablehnen
    request.send()
  })
}

Answer 1

要创建文件（我不确定您为什么需要它），您需要传入二进制数据

https://developer.mozilla.org/en -US/docs/Web/API/File/File

这是内存中的一个文件。您无法从磁盘读取它。您无法将其写入磁盘。我猜你可以将其设置为值并作为 FormData 发送。