Convert binary image data to image and display in HTML

Question

I'm working with Musicbrainsngs - the Python lib for Musicbrainz API. Making a request for some album artwork.

import musicbrainzngs as mb

release_group_ID = '5c14fd50-a2f1-3672-9537-b0dad91bea2f'
artwork = mb.get_release_group_image_front(release_group_ID)
print(artwork)

The documentation says it'll return "The binary image data" in a string.

My questions for you: What type of data is this- (Base 64 encoded PNG? How do I tell?)

But more importantly - What do I do with this? How do I save this as an image, or display it as an image with HTML?

The image data is 1mm characters- here's a short sample of the beginning:

b'x16\x00\xe0}\xc1\x17\xfb_U{R\xd43uL\xbf\xe33\xec3e(,\xa7p\x00\xa2+\x02   \x9c\x92\xb6\x0b\x00\x07\xf9x\xeaa\xd5\x99 i\xab$\xe2\x92\xa3Co\xb9`\xb9\x1cd\x911\x01[\x0c\xd0\x9c\xaa\x81\x08Q|\x13\xe4\xd9:c\xa47\xfe\xca*q\xf5\xd4O\xea\x0fi\x9c\xcc\xf8u\x88\x0b\x16\x11m?#F\x9d\x9a\xe8}I&\xfe\xb5]t\xcf\xf0\x1f\xeb\xce\x9d\xa4iy^\x8b\xf7;2cde\xac\xd0\xc9\x12\x7f<I$)\rI\x90\xe3j\xc2!D\xdbg\xfe&\xf2:"rl;)\x98\n\x80\x9e \x1fS\x8e\x87\xce\xaa\xe0\x8a\xc2\x9b\'

From looking at the code for musicbranzngs things are really vague as to how you should tell what was returned by the api. In its most simple form it makes an HTTP request to an API and then gives you the raw data that was returned. I assume you can write this to a dummy file descriptor of some sort. — mustachioed
– mustachioed, Commented Feb 21, 2018 at 23:40
Agreed. Was hoping I could use the lib, but you're right. Easiest way is just work around this method and call the API directly. I'll go ahead and do that. As for UTF-8, my understanding is that that's only for txt files, not images. — Will
– Will, Commented Feb 21, 2018 at 23:48
Yes, that's what I was thinking. That or rewrite the get_image code to return the response object and then work from there. — mustachioed
– mustachioed, Commented Feb 21, 2018 at 23:49
import base64....base64.decodestring(image_str)... have a read of this short tutorial.. maybe it will help..code.tutsplus.com/tutorials/… — johnashu
– johnashu, Commented Feb 21, 2018 at 23:51

Günther Eberl · Accepted Answer · 2018-04-10 19:23:07Z

Really looks like the API doesn't populate this info.

Alternative 1

Just take the binary data as it is and write it to a file (in binary mode). Then use magic (a libmagic wrapper) to determine the mime type. And rename it accordingly.

#! /usr/bin/python
# -*- coding: utf-8 -*-

import musicbrainzngs as mb
import magic
import os

release_group_ID = '5c14fd50-a2f1-3672-9537-b0dad91bea2f'
artwork = mb.get_release_group_image_front(release_group_ID)

result_file = 'result_file'

with open(result_file, 'wb') as file_handler:
    file_handler.write(artwork)

mime = magic.Magic(mime=True)
mime_type = mime.from_file(result_file)

if mime_type == 'image/jpeg':
    os.rename(result_file, result_file + '.jpg')
elif mime_type == 'image/png':
    os.rename(result_file, result_file + '.png')
elif mime_type == 'image/gif':
    os.rename(result_file, result_file + '.gif')
elif mime_type == 'image/bmp':
    os.rename(result_file, result_file + '.bmp')
elif mime_type == 'image/tiff':
    os.rename(result_file, result_file + '.tiff')
else:
    print('Not an image? %s' % mime_type)

Alternative 2

Again just take the binary data as it is and write it to a file (in binary mode). Now open it with PIL and save it in the format you actually want (PIL doesn't care about the format of the input image and about 80 different ones are supported). Then delete the original file.

#! /usr/bin/python
# -*- coding: utf-8 -*-

import musicbrainzngs as mb
from PIL import Image
import os

release_group_ID = '5c14fd50-a2f1-3672-9537-b0dad91bea2f'
artwork = mb.get_release_group_image_front(release_group_ID)

result_file = 'result_file'

with open(result_file, 'wb') as file_handler:
    file_handler.write(artwork)

Image.open(result_file).save(result_file + '.png', 'PNG')

os.remove(result_file)

Collectives™ on Stack Overflow

Convert binary image data to image and display in HTML

1 Answer 1

Alternative 1

Alternative 2

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Alternative 1

Alternative 2

Comments

Your Answer

Sign up or log in

Post as a guest

Related