I upload an image and send it to the back-end with this code:

const formData = new FormData();
formData.append('file', event.target.files[0]);

Then I am getting the payload of this image from the back-end which has a type of binary string. I want to display the image and I already tried this solutions:

1. Convert to a Blob and use it like this

const blob = new Blob([payload]);
<img src="data:image/png;base64,'+ blob" />

2. Use FileReader and readAsDataURL

var reader1 = new FileReader();
reader1.readAsDataURL(new Blob([payload]));
reader1.onload = function () {
    let paar: any = document.getElementById('imagePreview');
    paar.src = reader.result;
};

3. createObjectURL Blob

const blob = new Blob([payload]);
const url = URL.createObjectURL(blob);
const img: any = document.getElementById('imagePreview');
img.src = url;
img.onload = (e) => URL.revokeObjectURL(url);

Here the url looks like this: blob:http://localhost:3000/92540eea-6f01-46db-86d0-14491a8b6abf and it doesn't work, because it should look something like this: "data://base64".

How can I display this image ?