Unable to recognize the file type, should i convert the image to base64 encoding

from js import document, console, window, Uint8Array, File
from pyodide import create_proxy
import asyncio
import io
from PIL import Image
from pyodide.http import pyfetch, FetchResponse
import base64

async def browse_display(event):
console.log(event.target.value) # returns html element that triggers an event, “value” returns the value of the value attribute of text field
file_list = event.target.files # a list of files selected by the user
first_item = file_list.item(0)

old_image = document.getElementById("output_upload").querySelector("img")
if old_image:

new_image = document.createElement("img") 
new_image.src = window.URL.createObjectURL(first_item)   

new_image.width = 200  
new_image.height = 100 


array_buf = Uint8Array.new(await first_item.arrayBuffer()) # data arraybuffer (unsigned) from image
# convert to bytearray  

bytes_list = bytearray(array_buf) 
img_bytes = io.BytesIO(bytes_list)    

my_img = Image.open(img_bytes)         

async def image_to_text(image_data):  
    api_key = "XXXXXXXXXXXXXXX" 

    response = await pyfetch( 
        method = "POST", 
        headers={'apikey': api_key},
        files={'image': ('image', image_data)}

    data_dict = await response.json() 

await image_to_text(my_img) 

upload_img = create_proxy(browse_display)


document.getElementById(“image-upload”).addEventListener(“change”, upload_img)

Also to note that i am working with pyodide and pyscript so i have no access to the files locally within the browser environment. I also do not have access to requests so i am using a python wrapper (pyfetch) around javascript’s fetch api to send requests due to socket restriction in the browser.

Another update

I tried to convert “my_img” to a base64 string and it is correct but i still get
{‘OCRExitCode’: 99, ‘IsErroredOnProcessing’: True, ‘ErrorMessage’: [‘Unable to recognize the file type’, “E216:Unable to detect the file extension, or the file extension is incorrect, and no ‘file type’ provided in request. Please provide a file with a proper content type or extension, or provide a file type in the request to manually set the file extension.”], ‘ProcessingTimeInMilliseconds’: ‘0’} .