Question

I’m sending a blob file using an XHR request but I need to send some other data with it; preferably an array of data.

I know I can’t just call json_encode on the blob data because it’s binary data; but is there a way to do this?

edit: Can I use formdata to combine blob and array?

Answer 1

Typically you encode the data as base64 and then use multipart. The file data is encoded in base64 that you will need to decode on the server end. On client you can use window.btoa

Content-Type:multipart/form-data, boundary=xxxxxxxxx

--xxxxxxxxx
Content-Disposition: form-data; name='uploadfile'; filename='123_logo.jpg'
Content-Transfer-Encoding: base64
Content-Type: image/jpeg
/*base64data*/`

If the additional data is small you can set that as file name (your custom logic on server interprets it. Otherwise use another part of multipart for it.

20MB could be a large size for single upload. You may want to consider chunking in smaller chunks.