JavaScript - Pasar Como Parametro imagen a archivo js y lo devuelva en base64.

   
Vista:

Pasar Como Parametro imagen a archivo js y lo devuelva en base64.

Publicado por Vin (1 intervención) el 15/02/2016 22:16:52
Necesito me ayuden, tengo este codigo y me funciona, pero la idea es pasar una imagen como parametro a un archvo js y que me devuelva esa imagen codificada en base64 y asi poder incrustarla en em html.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<div class="ejemplo-linea">
    <input type="file" id="boton-file2" /><br />
    <input type="button" value="leer" onclick="leerArchivo()" /><br />
    <textarea rows="10" style="width: 98%" class="codigo" id="contenido-archivo"></textarea>
</div>
<script>
    function leerArchivo(){
     var inpute = document.getElementById("boton-file2");
      if (inpute.files.length > 0){
           var archivo = inpute.files[0];
           var lector = new FileReader();
           lector.addEventListener("load",function(evento){document.getElementById("contenido-archivo").value = evento.target.result;}, false);
           lector.readAsDataURL(archivo);
        }
}
</script>
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de xve

Pasar Como Parametro imagen a archivo js y lo devuelva en base64.

Publicado por xve (1594 intervenciones) el 16/02/2016 08:38:44
Hola Vin, es tan sencillo, como utilizar la función window.btoa() para convertir a base64... te adjunto tu código modificado:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<div class="ejemplo-linea">
    <input type="file" id="boton-file2" /><br />
    <input type="button" value="leer" onclick="leerArchivo()" /><br />
    <textarea rows="10" style="width: 98%" class="codigo" id="contenido-archivo"></textarea>
</div>
<script>
function leerArchivo(){
	var inpute = document.getElementById("boton-file2");
	if (inpute.files.length > 0){
		var archivo = inpute.files[0];
		var lector = new FileReader();
		lector.addEventListener(
			"load",
			function(evento){
				document.getElementById("contenido-archivo").value = window.btoa(evento.target.result);
			}, false
		);
		lector.readAsDataURL(archivo);
	}
}
 
</script>
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar