react-native-image-picker闪退的解决办法

字数 475阅读 5853

最近做项目用到了react-native-image-picker这个图片选择的第三方库,但在正确配置的情况下,点击选择相册会遇到闪退的问题,凭借开发原生的经验,找到了问题所在,在这里分享一下解决办法。

如果遇到什么问题可以在评论区回复,或者加QQ群397885169讨论

react-native.jpeg

问题

选择器.png
点击选择相册或者拍照都会闪退,在Chrome上是没有错误信息的,想看到错误信息需要再XCode上运行程序,才会看到。

错误信息.png

上面这段文字大致翻译过来的意思是
这个程序已经崩溃,因为它试图访问隐私数据但没有使用说明。在info.plist文件中必须包含一个NSPhotoLibraryUsageDescription关键字符串,来向用户解释应用程序如何使用这些数据。
说白了就是需要再info.plist里面新增一个键值对。
这个问题是因为iOS10对隐私权限的管理更为严格 ,比如访问的摄像头、麦克风等硬件,都需要提前请求应用权限、允许后才可以使用,或者现在要提前声明,虽然以往要求不严格,如果遇到闪退需要在
info.plist图片.png

注意:在一个iOS项目中会有两个info.plist,我们需要的是上面的那个文件,而不是Supporting Files 文件夹中的。

解决方法

流程1.png

![Uploading 流程2_390070.png . . .]
点击info.plist文件,会出现上面的内容,通过点击红框中的小加号,来添加需要的字段。
流程2.png

在红框里面填写NSPhotoLibraryUsageDescription(这个字段是访问相册,下面会有全部字段)
流程3.png

在后面的String中填写App需要您的同意,才能访问相册(这段文字可以随意更改)
流程4.png

填写完两个字段之后,就可以正常的使用react-native-image-picker啦!

这样一个一个添加是不是感觉很麻烦呢,在这里提供给大家一个简单的方式,在网上搜索的那些,都没有说明白下面两句话该写在那里。
<key>NSPhotoLibraryUsageDescription</key>
<string>photoLibraryDesciption</string>

更快捷的解决方法

更便捷的方式.png

按照上图的流程,点击Source Code

修改页面.png

经群友北极狼的经验,在安卓上也是可能出现闪退问题的,所以需要添加如下代码

android/app/src/AndroidManifest.xml中添加

 <uses-permission android:name="android.permission.CAMERA" />
 <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>

打开这个页面了吧!是不是感觉很熟悉,刚才写的东西,是不是以<key><key> <string><string>的形式展现出来了!接下来就是将最下面的参数,复制粘贴到上面啦!

需要用到的参数

<key>NSCameraUsageDescription</key>
<string>App需要您的同意,才能访问相机</string>

<key>NSPhotoLibraryUsageDescription</key>
<string>App需要您的同意,才能访问相册</string>

<key>NSPhotoLibraryAddUsageDescription</key>
<string>App需要您的同意,才能保存图片到您的相册</string>

<key>NSContactsUsageDescription</key>
<string>App需要您的同意,才能访问通讯录</string>

<key>NSLocationAlwaysUsageDescription</key>
<string>App需要您的同意,才能始终访问位置</string>

<key>NSLocationUsageDescription</key>
<string>App需要您的同意,才能访问位置</string>

<key>NSLocationWhenInUseUsageDescription</key>
<string>App需要您的同意,才能在使用期间访问位置</string>

<key>NSMicrophoneUsageDescription</key>
<string>App需要您的同意,才能访问麦克风</string>

<key>NSBluetoothPeripheralUsageDescription</key>
<string>App需要您的同意,才能访问蓝牙</string>

<key>NSCalendarsUsageDescription</key>
<string>App需要您的同意,才能访问日历</string>

<key>NSAppleMusicUsageDescription</key>
<string>App需要您的同意,才能访问媒体资料库</string>

<key>NSHealthShareUsageDescription</key>
<string>App需要您的同意,才能访问健康分享</string>

<key>NSHealthUpdateUsageDescription</key>
<string>App需要您的同意,才能访问健康更新</string>

<key>NSMotionUsageDescription</key>
<string>App需要您的同意,才能访问运动与健身</string>

<key>NSRemindersUsageDescription</key>
<string>App需要您的同意,才能访问提醒事项</string>

总结

这篇文章其实更像是一篇给自己用来做整理的文章,省的以后再去晚上找那些莫名其妙的参数了。
如果文章中有什么地方写错了,或写的不清楚的地方,欢迎在评论区评论,或者发私信给我哦。

推荐阅读更多精彩内容