Supabase•3w ago

`JSON Parse error: Unexpected character: <` error from supabase storage upload on Android

We are dealing with a JSON Parse error when uploading to supabase storage specifically when uploading camera photos selected from camera roll. We do not have this issue when uploading camera photos taken directly with Expo Image Picker camera, or when uploading screenshots. Supabase storage responds only with a JSON Parse error, but we don't know what's being parsed or why it would be different between these cases. In our expo project we use Expo Image Picker to upload images. We get the assets and upload them to supabase storage with the following steps: 1. Parse the image type (png, jpeg) and create a FormData

const photo = {
    uri: uri,
    type: type,
    name: fileName,
  }; 
  const formData = new FormData();
  formData.append("file", photo);

const photo = {
    uri: uri,
    type: type,
    name: fileName,
  }; 
  const formData = new FormData();
  formData.append("file", photo);

An example of photo here would be {"name": "{uuid}.jpeg", "type": "image/jpeg", "uri": "file:///data/user/0/{project}/cache/ImagePicker/{uuid}.jpeg"} 2. Upload formData to supabase storage bucket

  const imagePath = `${user_id}/${fileName}`;
  let { error } = await supabase.storage
    .from(bucketName)
    .upload(imagePath, formData);

  const imagePath = `${user_id}/${fileName}`;
  let { error } = await supabase.storage
    .from(bucketName)
    .upload(imagePath, formData);

- When we take a photo and use ImagePicker.launchCameraAsync({ allowsEditing: false, mediaTypes: ["images"]}); , this uploads successfully. - When we upload a screenshot, this uploads successfully. This uses await ImagePicker.launchImageLibraryAsync({mediaTypes: ["images"]}) However when uploading a selected photo from camera roll with await ImagePicker.launchImageLibraryAsync({mediaTypes: ["images"]}) that works for a screenshot, this no longer works and responds with the JSON Parse error. - There are no logs or errors in Supabase Storage when this fails. - There are no logs or errors in Supabase API Gateway when this fails. Has anyone experienced this issue? How can we get more details on why this error is occurring, or find logs to help debug this? Details: "expo-image-picker": "^16.1.4" "@supabase/supabase-js": "^2.54.0" Reproduced on Pixel 6, Pixel 9

2 Replies

garyaustin•3w ago

If the request is not getting to the API Gateway log then the error is occurring the client before the data is sent.
You might log out the full pathnames and bucket name and make sure there are no special characters. Also there is a note for React Native https://supabase.com/docs/reference/javascript/storage-from-upload but not sure why one file would work and the other would not. But I don't use Expo or React Native.

JavaScript: Upload a file | Supabase Docs

Supabase API reference for JavaScript: Upload a file

jjOP•3w ago

Thanks for the tip. In case anyone else gets stuck on this, changing from FormData to ArrayBuffer per the note fixed it for us. Appreciate the quick response

Gaming

Programming

`JSON Parse error: Unexpected character: <` error from supabase storage upload on Android

Did you find this page helpful?