Rebar Rebar - 1 month ago 26
Node.js Question

Can't read Blob Image - Ionic 3 / Angular 4

I got a dump problem.

I uploaded an Image manually as Longblob on my MySQL Database as shown:

enter image description here

Now I try to display that Image in my Hybrid Ionic 3 / Angular 4 App in my Template:

<img *ngIf="user.image" ng-src="data:image/png;base64,{{user.image}}" >


When I look up my Network Traffic in Chrome I only see an empty Image as shown:

enter image description here

For Information: the
user.image
is from type Buffer as and Array.

Why doesn't it show my Blob-Image?

Answer Source

The encoded data is not a Buffer of type array. Instead the binary data is encoded into base 64 format.

http://dataurl.net/#dataurlmaker

The above url helps to convert the binary data to base 64 format.

When you store in the MySQL database, you need to store it the encoded data as it is.

Hope it helps.