jpeg 의 Javascript 네이티브 Blob 이 있으며 firestore blob 으로 저장하고 싶습니다 .
하지만 물론 Firestore는 "FirebaseError : Function DocumentReference.update ()가 잘못된 데이터로 호출되었습니다. 지원되지 않는 필드 값 : 사용자 정의 Blob 객체 (문서의 필드 이미지에 있습니다 ..."라고 말합니다. "
javascript-blob에서 firestore-blob로 변환하는 방법이 있습니까?
canvas.toBlob(async (blob)=> {
console.info(`Converting to blob: ${blob.constructor.name} and storing to firestore...`);
await myselfRef.update({
image: blob
}, 'image/jpeg', 0.4));
JavaScript Blob을 Firestore Blob으로 변환하려면 다음 단계를 따라야합니다.
your_blob.arrayBuffer()
.firebase.firestore.Blob.fromUint8Array(your_array)
, 마지막으로, 경우 FireStore 물방울을 만드는 방법.Firestore Blob에서 JavaScript Blob으로 역변환을 수행하려면 거의 반대로 수행해야합니다.
firestore_blob.toUint8Array()
.new Blob([my_array])
.실제로 이에 대한 예가 있습니다. 이 함수 save()
는 캔버스의 내용을 Firestore에 저장하는 데 사용됩니다. 그리고 함수 load()
는 다시 캔버스에로드합니다.
const canvas = document.querySelector('canvas');
const context = canvas.getContext('2d');
const db = firebase.firestore();
function save() {
canvas.toBlob(async blob => {
const blob_url = URL.createObjectURL(blob);
const ref = db.collection('blob').doc('blob');
const array_buffer = await blob.arrayBuffer();
const uint8_array = new Uint8Array(array_buffer);
const firebase_blob = firebase.firestore.Blob.fromUint8Array(uint8_array);
ref.update({
image: firebase_blob,
});
});
}
async function load() {
const ref = db.collection('blob').doc('blob');
const doc = await ref.get();
const firebase_blob = doc.get('image');
const uint8_array = firebase_blob.toUint8Array();
const blob = new Blob([uint8_array]);
const blob_url = URL.createObjectURL(blob);
const image = new Image();
image.onload = () => {
context.clearRect(0, 0, canvas.width, canvas.height);
context.drawImage(image, 0, 0);
URL.revokeObjectURL(blob_url);
}
image.src = blob_url;
}
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다