when receiving the image and converting to base64 it is being cut

[Henriquehlr]

Has anyone had this problem of receiving the uri image and when passing it to base64 it is being cut, follow the example of the code snippets:

const image = await camRef.current.capture();

const baseImage = await getBase64(image.uri)

async function getBase64(uri) { return RNFetchBlob.fs.readFile(uri, 'base64') .then(base64data => { return base64data; }) .catch(error => {

    throw error;
  });

}

setCapturedPhoto('data:image/jpeg;base64,' + baseImage);

how the image looks after converting:

[Henriquehlr]

@scarlac Have you seen anything related?

[DavidBertet]

What is setCapturedPhoto doing? Your example is not complete enough to reproduce the issue without taking assumptions.

Please share a minimal sample with logic and view that contains everything needed to reproduce.

Thanks!

[Henriquehlr]

@DavidBertet setCapture just stores the base64 string const [capturedPhoto, setCapturedPhoto] = useState(null);

Here's the coding:

//Action when taking the photo const takePicture = async () => { if (camRef.current) { try { const image = await camRef.current.capture();

    if (image && image.uri) {
      const base64Image = await getBase64(image.uri);
      setCapturedPhoto('data:image/jpeg;base64,' + base64Image);
    }
  } catch (error) {
    console.error('Error capturing photo:', error);
  }
}

};

// function Base64 const getBase64 = async (uri) => { return RNFetchBlob.fs .readFile(uri, 'base64') .then((base64data) => { return base64data; }) .catch((error) => { console.log('Error:', error); throw error; }); }

//component <Camera ref={camRef} cameraType={type} flashMode="auto" torchMode={flashMode} style={{ height: '100%', width: '100%', }} />

        //button
         <TouchableOpacity
        style={fotoPessoaStyle.button}
        onPress={() => takePicture()}>
        <MaterialIcons
          name="camera-alt"
          size={32}
          color={colors.colorPrimary.color}
        />

[DavidBertet]

Where is capturedPhoto being used?

[Henriquehlr]

In this section and to send the information to the database in which the image is cut, in the visual part of the code it is ok <Image source={{uri: capturedPhoto}} style={{width: '100%', height: '100%', alignSelf: 'center'}} />

[scarlac]

@Henriquehlr remove the base64 encoding process and see if the issue persists. If it doesn't, then it isn't a bug in the library. You need to reduce the code to the smallest amount that still shows the problem and show it in full so we can review or reproduce.

[DavidBertet]

Sounds like we are still missing key details to help you further. It seems like something is cropping your base64 string at some point. Images are pretty big, so make sure every layer of your system is sized to deal with very long strings.

But from what I understand, it doesn't seem to be linked to that library.