display byte format jpeg in img

Question

I have a byte format jpeg that I get from python that looks like this b'\xff\xd8\xff\xe0\x00\x10JFIF\x00\x01\x01\...'. How can I display that inside an HTML img tag? Any help is appreciated. Thanks in advance.

Answer 1

Encode the bytes to base64, then use the native HTML b64 format for your image:

from base64 import b64encode

bytez = b'\xff\xd8\xff\xe0\x00\x10JFIF\x00\x01\x01'
b64_encoded = b64encode(bytez).decode()
print(b64_encoded)
>>> '/9j/4AAQSkZJRgABAQ=='

and then:

<img src="data:image/jpg;base64, /9j/4AAQSkZJRgABAQ==" alt="Your image" />

Answer 2

Simple answer: write it to a file and have the HTML refer to it.

        b = b'\xff\xd8\xff\xe0\x00\x10JFIF\x00\x01\x01\...'
        with open('image.jpg', 'wb') as f:
            f.write(b)

In the HTML document:

        <img src="image.jpg">

---

Hairier answer: base64 encode it, using data:image/jpeg;base64.