... a pesar de que se ve bien en la consola. Probando un servicio web - mashape - y debería recibir una imagen en un flujo de datos base64. Cuando compruebo la respuesta en la consola (FF) se ve bien: se muestra la imagen. Pero el seguimiento del mismo flujo de datos en la consola muestra muchos "caracteres no válidos" (no Base64). Y la imagen es solo un montón de caracteres (no una imagen). Parece que se realiza alguna codificación en el flujo de datos, cuando intento obtenerlo. He intentado obtener los "datos sin procesar", pero no sé cómo.
¿Supongo que no se trata de codificar/decodificar la imagen base64? El flujo de datos ya debería estar codificado en base64. ¿Quizás se trata más de preservar los datos base64 en un formato sin procesar? ¿O un mimetipo? ¿O? ¡Ayuda!
$(document).ready(function () { $.ajax({ type: "GET", url: "https://ronreiter-meme-generator.p.mashape.com/meme?top=suk", headers: { "X-Mashape-Key": "my secret key ;-)" }, contentType: "application/x-www-form-urlencoded; charset=UTF-8", // mimeType: "text/plain; charset=x-user-defined", dataType: "text", // html or json or xml success: function (data) { console.log(data); var src = "data:image/jpeg;charset=utf-8;base64, " + data; //var src = "data:image/jpeg;base64, " + data; $("output").html("<img src='" + src + "' alt='' />"); }, error: function (XMLHttpRequest, textStatus, errorThrown) { ...¡OBS! Actualizar... gracias a esta publicación de stackoverflow , descubrí que este código JavaScript simple resolverá el problema. Parece que jQuery ajax no tiene la posibilidad de agregar xhr.responseType='blob', y eso es lo que me falta en mi solución jQuery.
¿Existe tal vez una forma de resolver el problema (obteniendo la imagen como blob) con jQuery ajax como se preguntó en la pregunta inicial?
var xhr = new XMLHttpRequest(); xhr.onreadystatechange = function () { if (this.readyState == 4 && this.status == 200) { var res = this.response; var reader = new window.FileReader(); reader.readAsDataURL(res); reader.onloadend = function () { //done(reader.result.split('base64,')[1]); alert(reader.result); document.querySelector("output").innerHTML = "<img src='" + reader.result + "' />"; } } } xhr.open("Get", "https://ronreiter-meme-generator.p.mashape.com/meme?top=suk"); xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded'); xhr.setRequestHeader('X-Mashape-Key', 'still a secret :-)'); xhr.send(); xhr.responseType = 'blob'; xhr.send();