Search code examples
pythonimagebase64

Converting data:image from base64 to JPEG in Python


From the client's POST submission, we are successfully receiving an image in the following format, data:image/jpeg;base64,/9j/.... and an image file is being generated by the following code:

@app.route('/submission', methods=('GET', 'POST'))
def submission():
    
    if request.method == 'POST':
        
        raw_image = request.form['file']
        #Problem Starts Here
        # this doesn't work either: 
        # raw_image = raw_image.replace("data:image/jpeg;base64,/9j/", '');
        with open(UPLOADED_IMAGES_DEST+'/image.jpeg', 'wb') as fh:
            fh.write(base64.decodebytes(raw_image))
        #Problem Ends Here
        return jsonify(request.form)
        
    return render_template('submission.html')

However, the image cannot be opened as it's an "Invalid or Unsupported Format". I'm trying to improve the conversion process so it will produce a viewable JPEG image.

Beginning of raw_image:

data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDAAMCAgMCAgMDAwMEAwMEBQgFBQQEBQoHBwYIDAoMDAsKCwsNDhIQDQ4RDgsLEBYQERMUFRUVDA8XGBYUGBIUFRT/2wBDAQMEBAUEBQkFBQkUDQsNFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBT/wAARCADwAUADASIAAhEBAxEB/8QAHQAAAgIDAQEBAAAAAAAAAAAABQYEBwIDCAEACf/EAEwQAAEDAwMCBAQEAwUFBQQLAAECAxEABAUGEiExQQcTUWEIInGBFDKRoRVCUiOxwdHwJGJyouEJFjOSwhdDgvEmU2ODk7LDxNLU4v/EABsBAAMBAQEBAQAAAAAAAAAAA...


Solution

  • I took your data, and decoded it, it looks quite close to the JPEG header I took from the real file (picture below). Don't see any problem, except, you have to start decoding from /9j/4AA... onwards.

    >>> a = '/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDAAMCAgMCAgMDAwMEAwMEBQgFBQQEBQoHBwYIDAoMDAsKCwsNDhIQDQ4RDgsLEBYQERMUFRUVDA8XGBYUGBIUFRT/2wBDAQMEBAUEBQkFBQkUDQsNFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBT/wAARCADwAUADASIAAhEBAxEB/8QAHQAAAgIDAQEBAAAAAAAAAAAABQYEBwIDCAEACf/EAEwQAAEDAwMCBAQEAwUFBQQLAAECAxEABAUGEiExQQcTUWEIInGBFDKRoRVCUiOxwdHwJGJyouEJFjOSwhdDgvEmU2ODk7LDxNLU4v/EABsBAAMBAQEBAQAAAAAAAAAA'
    >>> base64.b64decode(a)
    '\xff\xd8\xff\xe0\x00\x10JFIF\x00\x01\x01\x00\x00\x01\x00\x01\x00\x00\xff\xdb\x00C\x00\x03\x02\x02\x03\x02\x02\x03\x03\x03\x03\x04\x03\x03\x04\x05\x08\x05\x05
    

    This is a hex dump from the real JPEG picture of mine.

    enter image description here

    You have to remove data:image/jpeg;base64,, but don't go beyond that -- this will break the image data.