Al actualizar de Firebase 8 a 9, me encontré con un problema. Necesito monitorear el progreso de carga de uploadString pero uploadTask.on parece fallar.
var uploadTask = uploadString(ref(this.$storage, 'profile.jpg'), canvas.toDataURL('image/jpeg', 0.8), 'data_url'); uploadTask.on('state_changed', (snapshot) => { const progress = (snapshot.bytesTransferred / snapshot.totalBytes) * 100; console.log('Upload is ' + progress + '% done'); }, (error) => { // Handle unsuccessful uploads }, () => { // Handle successful uploads on complete } );La imagen se carga pero con el siguiente error:
"TypeError: uploadTask.on no es una función"
uploadTask.on con putString en la versión 8 funciona bien. ¿Alguien sabe lo que está pasando? Gracias por adelantado.
Encontré una solución para cualquier persona interesada, funciona específicamente para elementos de lienzo y usa uploadBytesResumable en su lugar. Todavía estoy interesado en cómo lograr esto con uploadString si alguien sabe.
var img = canvas.toDataURL('image/jpeg', 0.8); var file = now.dataURItoBlob(img); var uploadTask = uploadBytesResumable(ref(now.$storage, 'profile.jpg'), file); uploadTask.on('state_changed', (snapshot) => { const progress = (snapshot.bytesTransferred / snapshot.totalBytes) * 100; console.log('Upload is ' + progress + '% done'); }, (error) => { // Handle unsuccessful uploads }, () => { // Handle successful uploads on complete } );La función dataURItoBlob es la siguiente
dataURItoBlob(dataURI) { var byteString; if (dataURI.split(',')[0].indexOf('base64') >= 0){ byteString = atob(dataURI.split(',')[1]); } else{ byteString = unescape(dataURI.split(',')[1]); } var mimeString = dataURI.split(',')[0].split(':')[1].split(';')[0]; var ia = new Uint8Array(byteString.length); for (var i = 0; i < byteString.length; i++) { ia[i] = byteString.charCodeAt(i); } return new Blob([ia], {type:mimeString}); }uploadString() devuelve un uploadTask. Lo usa para monitorear el estado de su carga