On localhost it works, on the deployed version - it doesn't. Get image request:
public getImage(imageUrl: string): Observable<Blob> {
return this.http.get(imageUrl, {
responseType: 'blob',
headers: this.getHeaders(),
});
}
Then I use the function, which creates URL:
public createImageFromBlob(slug: string, image: Blob): Observable<boolean> {
const reader = new FileReader();
this.photos.set(slug, '');
reader.addEventListener(
'load',
() => {
this.photos.set(slug, reader.result);
return of(true);
},
false,
);
if (image) {
reader.readAsDataURL(image);
}
return of(false);
}
And display image
<div
class="image-container"
[ngStyle]="{
'background-image': imageSrc ? 'url(' + imageSrc + ')' : ''
}"
>
</div>
On localhost I get this and it renders.
background-image: url(data:application/force-download;base64,UklGRso........Url
But on deployed version URL has different type:
background-image: url(data:text/html;base64,PCFEasdg980asdgT......URL);
Why is this happening and what should I do?