暖宝宝官方认证铲屎官
Couldn't get file path for photo on ANDROID 10
发布于: 2020-11-03 更新于: 2021-02-18 分类于: Android 阅读次数: 

昨天在使用RN的react-native-image-picker(v2.3.4)组件时遇到了一个问题,通过yarn添加组件后,根据文档导入变量并调用相机拍照

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
import ImagePicker from 'react-native-image-picker';
cameraOperation() {
const options = {
title: 'Take a photo',
//自定义按钮,目前没发现有什么用
customButtons: [{ name: 'fb', title: 'Choose photo from Facebook' }],
storageOptions: {
skipBackup: true,
path: 'images'
}
};
ImagePicker.showImagePicker(options, (response) => {
//path:图片的存储路径
//uri:在当前app内的存储路径
//width、height:拿到的图片的宽高
//data:图片的base64格式数据
console.log('Response = ', response);
if (response.didCancel) {
console.log('User cancled image picker');
}
else if (response.error) {
console.error('ImagePicker error:', response.error);
}
else if (response.customButton) {
console.log('User tapped custom button:', response.customButton);
}
else {
console.log(response.uri);
const source = { uri: response.uri };
this.setState({ avatarSource: source });
}
});
}

然而在运行时,却抛出了标题所述的错误,开始不得其解,后来搜索了一下资料,原来是因为API29的原因,API29对应的安卓版本是Android10,而Android中引入了分区存储(Scoped storage)的概念,这样做的初衷是为了避免APP乱写文件从而产生很多乱七八糟的冗余文件,更好的保护用户数据,具体的介绍可以看这里(传送门

解决方法

修改AndroidManifest.xml文件
我用的RN版本是0.63.3,react-native-cli的版本是4.13.0,项目是用react-native-cli来init的,AndroidManifest.xml路径在android/app/src/main下,在application标签中,添加
android:requestLegacyExternalStorage ="true"
属性,即可正常调用摄像头并拍照~

--- 本文结束 The End ---