이미지 URL을 파일 인스턴스로 변환
<p>이미지 데이터 배열이 있고 이를 <코드>파일</code>배열</p>로 변환하려고 합니다.
<pre class="brush:php;toolbar:false;">const 이미지 = [
{ img: "http://localhost/images/1.jpg", 이름: "1.png", mime_type: "image/jpeg" },
{ img: "http://localhost/images/2.jpg", 이름: "2.png", mime_type: "image/jpeg" },
]
const res: File[] = Images.map(function (item) {
새 파일 반환([item.img], item.name, { 유형: item.mime_type })
})</pre>
<p>이것은 작동하지 않습니다.(제가 이해하기로는 base24의 변환된 이미지가 파일 생성자에 전달되어야 합니다. 어떻게 해야 합니까?</p>
<p>업데이트:
이미지를 처리하는 VUE 구성 요소가 있습니다. 입력 구성 요소에는 배열 유형의 속성이 있습니다. 데이터베이스에서 반환된 데이터를 기반으로 배열을 만드는 방법입니다. 데이터베이스에서 반환: 이미지 링크, 이름 및 유형. </p>
<p>UPD2 답변:</p>
<pre class="brush:php;toolbar:false;">let PhotosAsFile: File[] = []
const _photos = [
{ url: "http://localhost:8080/images/1.jpeg", 이름: "name1", mime_type: "image/jpeg"
{ url: "http://localhost:8080/images/2.jpeg", 이름: "name2", mime_type: "image/jpeg"
{ url: "http://localhost:8080/images/3.jpeg", 이름: "name3", mime_type: "image/jpeg"
]
const data: Promise[] = _photos.map(async 함수(항목): Promise {
const myBlob: Blob = getBlobFromUrl(item.url)을 기다립니다.
const 확장 파일: RegExpMatchArray | null | 정의되지 않음 = item.url?.match(/.([^.]+)$/)
return new File([myBlob], ExtensionsFile && item.name ? item.name + "." + ExtensionsFile[1] : "image.jpeg", {
유형: item.mime_type ?? "이미지/jpeg",
})
})
Promise.all(data).then((values: File[]): void => {
PhotosAsFile = 값
})
const getBlobFromUrl = (url): 약속<Blob>
return new Promise((해결, 거부): void => {
const 요청: XMLHttpRequest = 새로운 XMLHttpRequest()
request.open("GET", url, true)
request.responseType = "블롭"
request.onload = () =>
해결(요청.응답)
}
request.onerror = 거부
요청.전송()
})
}</pre></p>
