Posterior a investigar con especialistas en esta materia, programadores de deferentes áreas y maestros dimos con la solución al dilema y la compartimos en esta publicación.
Solución:
-
.readAsDataURL()devuelve una URL que representa los datos del archivo como codificado en base64 string -
.readAsArrayBuffer()devuelve un ArrayBuffer que representa los datos del archivo -
.readAsText()devolver los datos del archivo como un texto string.
Para más información revisa esto FileReader Doc.
readAsDataURL() devolverá un string que se puede pegar en la url attribute de una etiqueta HTML (por ejemplo: src= en una img). Por un img etiqueta, que efectivamente mostrará la imagen como si src era una dirección del archivo que se leyó. Es una transformación (más grande) del contenido del archivo original.
readAsText() devolverá un string de caracteres que pueden analizarse mediante funciones de JavaScript o mostrarse en un área de texto y es probable que el usuario los entienda. Esto suele ser útil para leer archivos de texto.
Creo que si desea tener una funcionalidad de carga de archivos y luego mostrarle al usuario una vista previa del archivo que eligió de su PC y que está a punto de cargar, entonces use .readAsDataURL().
Si desea manipular un archivo de texto, utilice .readAsText()
Si desea manipular algo como una imagen (convertir un jpeg a PNG, por ejemplo), use .readAsArrayBuffer().
Hay un cuarto método, .readAsBinaryStringpero la documentación de Mozilla sugiere usar .readAsArrayBuffer() en lugar de.
Reseñas y valoraciones
Agradecemos que quieras añadir valor a nuestro contenido cooperando tu experiencia en las interpretaciones.