Utilisation de JavaScript pour afficher un objet blob

Question

Je récupère une image Blob à partir d’une base de données et j’aimerais pouvoir afficher cette image à l’aide de JavaScript. Le code suivant produit une icône d’image rompue sur la page :

Voici un jsFiddle contenant tout le code requis, y compris l’objet blob. Le code terminé doit afficher correctement une image.

Answer 1

Vous pouvez également obtenir un objet BLOB directement à partir de XMLHttpRequest. L’affectation de la place à responseType sur blob est une astuce. Voici mon code:

Et la fonction de réponse ressemble à ceci:

Il suffit de faire un élément image vide en HTML :

Answer 2

Si vous souhaitez utiliser fetch à la place :

source:

https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch

Answer 3

Dans votre exemple, vous devez `` .

Dans votre lien, `` .

Cela fonctionne, tant que vos données sont valides http://jsfiddle.net/SXFwP/ (je n’avais pas d’images BMP, j’ai donc dû utiliser PNG).

Answer 4

Je suppose que vous aviez une erreur dans le code en ligne de votre image. Essayez ceci :

<div class="snippet" data-babel="false" data-console="true" data-hide="false" data-lang="js"> <div class="snippet-code">

</div></div>Lien utile :http://dean.edwards.name/my/base64-ie.html