[英][React Native][expo-camera] Corrupt base64 saved image on Android
I use React Native and Expo to develop an application on mobile and tablet.我使用React Native 和 Expo在手机和平板电脑上开发应用程序。 I need to be able to take a photo and save it to my local SQLite database.
我需要能够拍照并将其保存到我本地的 SQLite 数据库中。 I manage to take my photo and save it, then display it on a page.
我设法拍下照片并保存,然后将其显示在页面上。 I use expo-camera .
我使用expo-camera 。
Everything is fine in IOS. IOS 一切正常。 However, the image is corrupted on Android .
但是, Android 上的图像已损坏。 My images are saved in base64.
我的图像保存在 base64 中。 I add two links leading to the result on android and on IOS.
我在 android 和 IOS 上添加了两个指向结果的链接。
IOS version Android version IOS 版Android 版
The conversion to base64 takes place at the end of this extract in __takePicture :到 base64 的转换发生在__takePicture中此摘录的末尾:
const [startCamera, setStartCamera] = useState(false);
const [photo, setPhoto] = useState(null);
const [zoom, setZoom] = useState(0);
const [hasPermission, setHasPermission] = useState(null);
const [type, setType] = useState(CameraType.back);
const [camera, setCamera] = useState(null);
useEffect(() => {
(async () => {
const { status } = await Camera.requestCameraPermissionsAsync();
setHasPermission(status === 'granted');
})();
}, []);
useEffect(() => {
__startCamera(props.startCamera);
}), [startCamera, props.startCamera];
const __startCamera = async (props) => {
const { status } = await Camera.requestCameraPermissionsAsync();
if (status === "granted") {
setStartCamera(props);
} else {
Alert.alert("Action impossible", "Demande d'accès");
}
};
const __takePicture = async () => {
if (!camera) return;
const photo = await camera.takePictureAsync({ base64: true });
setPhoto(photo);
const manipResult = await manipulateAsync(photo.uri, [], {
compress: 0,
format: SaveFormat.JPEG,
base64: true,
});
setPhoto(manipResult);
};
Picture display:图片展示:
<Image
source={{ uri: photo.uri }}
resizeMode="cover"
style={{
width: "80%",
height: "80%",
backgroundColor: "black",
borderWidth: 5,
borderRadius: 10,
}}
/>
Do you know where the problem comes from?你知道问题出在哪里吗? Thank you for your time.
感谢您的时间。
Answer provided by Timotius from the Discord Reactiflux server which worked for me: change compress: 0
to compress: 1
Timotius 从 Discord Reactiflux 服务器提供的答案对我有用:将
compress: 0
更改为compress: 1
Another element that he brings back from their documentation which may prove useful: "SaveFormat.PNG compression is lossless but slower, SaveFormat.JPEG is faster but the image has visible artifacts. Defaults to SaveFormat.JPEG"他从他们的文档中带回的另一个可能被证明有用的元素:“SaveFormat.PNG 压缩是无损但速度较慢,SaveFormat.JPEG 更快但图像有可见的伪影。默认为 SaveFormat.JPEG”
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.